2
0

feat(inputs): Add number input

This commit is contained in:
Baptiste Arnaud
2022-01-08 07:40:55 +01:00
parent 2a040308db
commit d54ebc0cbe
33 changed files with 467 additions and 207 deletions

View File

@ -1,4 +1,4 @@
import { PublicTypebot, StepType, Typebot } from 'models'
import { InputStepType, PublicTypebot, Typebot } from 'models'
import { Plan, PrismaClient } from 'db'
import { parseTestTypebot } from './utils'
@ -58,7 +58,7 @@ const createTypebots = async () => {
byId: {
step1: {
id: 'step1',
type: StepType.TEXT_INPUT,
type: InputStepType.TEXT,
blockId: 'block1',
},
},

View File

@ -1,6 +1,5 @@
import {
Block,
StepType,
Theme,
BackgroundType,
Settings,
@ -59,7 +58,7 @@ export const parseTestTypebot = ({
byId: {
step0: {
id: 'step0',
type: StepType.START,
type: 'start',
blockId: 'block0',
label: 'Start',
target: { blockId: 'block1' },

View File

@ -1,5 +1,5 @@
import { parseTestTypebot } from 'cypress/plugins/utils'
import { StepType } from 'models'
import { BubbleStepType } from 'models'
describe('Text bubbles', () => {
beforeEach(() => {
@ -15,7 +15,7 @@ describe('Text bubbles', () => {
step1: {
id: 'step1',
blockId: 'block1',
type: StepType.TEXT,
type: BubbleStepType.TEXT,
content: { html: '', plainText: '', richText: [] },
},
},

View File

@ -1,42 +1,14 @@
import { parseTestTypebot } from 'cypress/plugins/utils'
import { StepType } from 'models'
import { InputStep, InputStepType } from 'models'
describe('Text input', () => {
beforeEach(() => {
cy.task('seed')
cy.task(
'createTypebot',
parseTestTypebot({
id: 'typebot3',
name: 'Typebot #3',
ownerId: 'test2',
steps: {
byId: {
step1: {
id: 'step1',
blockId: 'block1',
type: StepType.TEXT_INPUT,
},
},
allIds: ['step1'],
},
blocks: {
byId: {
block1: {
id: 'block1',
graphCoordinates: { x: 400, y: 200 },
title: 'Block #1',
stepIds: ['step1'],
},
},
allIds: ['block1'],
},
})
)
createTypebotWithStep({ type: InputStepType.TEXT })
cy.signOut()
})
it('text input options should work', () => {
it('options should work', () => {
cy.signIn('test2@gmail.com')
cy.visit('/typebots/typebot3/edit')
cy.findByRole('button', { name: 'Preview' }).click()
@ -48,6 +20,7 @@ describe('Text input', () => {
.type('Your name...')
cy.findByRole('textbox', { name: 'Button label:' }).clear().type('Go')
cy.findByRole('button', { name: 'Restart' }).click()
cy.findByTestId('step-step1').should('contain.text', 'Your name...')
getIframeBody().findByPlaceholderText('Your name...').should('exist')
getIframeBody().findByRole('button', { name: 'Go' })
cy.findByTestId('step-step1').click({ force: true })
@ -57,6 +30,68 @@ describe('Text input', () => {
})
})
describe('Number input', () => {
beforeEach(() => {
cy.task('seed')
createTypebotWithStep({ type: InputStepType.NUMBER })
cy.signOut()
})
it.only('options should work', () => {
cy.signIn('test2@gmail.com')
cy.visit('/typebots/typebot3/edit')
cy.findByRole('button', { name: 'Preview' }).click()
getIframeBody().findByPlaceholderText('Type your answer...').should('exist')
getIframeBody().findByRole('button', { name: 'Send' })
cy.findByTestId('step-step1').click({ force: true })
cy.findByRole('textbox', { name: 'Placeholder:' })
.clear()
.type('Your name...')
cy.findByRole('textbox', { name: 'Button label:' }).clear().type('Go')
cy.findByRole('spinbutton', { name: 'Min:' }).type('0')
cy.findByRole('spinbutton', { name: 'Max:' }).type('100')
cy.findByRole('spinbutton', { name: 'Step:' }).type('10')
cy.findByRole('button', { name: 'Restart' }).click()
cy.findByTestId('step-step1').should('contain.text', 'Your name...')
getIframeBody()
.findByPlaceholderText('Your name...')
.should('exist')
.type('-1{enter}')
.clear()
.type('150{enter}')
getIframeBody().findByRole('button', { name: 'Go' })
cy.findByTestId('step-step1').click({ force: true })
})
})
const createTypebotWithStep = (step: Omit<InputStep, 'id' | 'blockId'>) => {
cy.task(
'createTypebot',
parseTestTypebot({
id: 'typebot3',
name: 'Typebot #3',
ownerId: 'test2',
steps: {
byId: {
step1: { ...step, id: 'step1', blockId: 'block1' },
},
allIds: ['step1'],
},
blocks: {
byId: {
block1: {
id: 'block1',
graphCoordinates: { x: 400, y: 200 },
title: 'Block #1',
stepIds: ['step1'],
},
},
allIds: ['block1'],
},
})
)
}
const getIframeBody = () => {
return cy
.get('#typebot-iframe')