diff --git a/e2e/base/commands/fill.spec.tsx b/e2e/base/commands/fill.spec.tsx new file mode 100644 index 000000000..d0f92f6b2 --- /dev/null +++ b/e2e/base/commands/fill.spec.tsx @@ -0,0 +1,42 @@ +import { useState } from 'react' + +import { Output } from '../../../.storybook/components/Output' +import { StoryBox } from '../../../.storybook/components/StoryBox' +import { useFieldControl, type TextInputProps, TextInput } from '../../../src' +import { mountAndWait, outputShouldBe, outputShouldNotBe } from '../utils' + +function TextInputStory({ value, ...otherProps }: TextInputProps) { + const [outputValue, setOutputValue] = useState('∅') + + const { controlledOnChange, controlledValue } = useFieldControl(value, setOutputValue) + + return ( + <> + + + + {outputValue !== '∅' && } + + ) +} + +context('Fill', () => { + const commonProps: TextInputProps = { + label: 'A text input', + name: 'myTextInput' + } + + it('Should fill the second input', () => { + mountAndWait( + + + + ) + + outputShouldNotBe() + + cy.fill('A text input', 'abcd', { index: 1 }) + + outputShouldBe('abcd') + }) +}) diff --git a/src/cypress/commands/clickButton.ts b/src/cypress/commands/clickButton.ts index 7e947c60d..12a9d7811 100644 --- a/src/cypress/commands/clickButton.ts +++ b/src/cypress/commands/clickButton.ts @@ -1,4 +1,4 @@ -import { findElementBytext } from '../utils/findElementBytext' +import { findElementByText } from '../utils/findElementByText' const RETRIES = 5 @@ -13,7 +13,7 @@ function findButton( prevSubjectElement: HTMLElement | undefined } ): HTMLElement | undefined { - const buttonElement = findElementBytext(`${preSelector}button`, label, { + const buttonElement = findElementByText(`${preSelector}button`, label, { index, inElement: prevSubjectElement }) @@ -35,7 +35,7 @@ function findButton( return buttonElementByTitle as HTMLElement } - const menuItemElement = findElementBytext(`${preSelector}[role="menuitem"]`, label, { + const menuItemElement = findElementByText(`${preSelector}[role="menuitem"]`, label, { index, inElement: prevSubjectElement }) diff --git a/src/cypress/commands/fill/constants.ts b/src/cypress/commands/fill/constants.ts index 1dbc6455f..f8f596762 100644 --- a/src/cypress/commands/fill/constants.ts +++ b/src/cypress/commands/fill/constants.ts @@ -1,5 +1,6 @@ export const DEFAULT_OPTIONS: Cypress.FillOptions = { delay: 10, force: true, + index: 0, retries: 5 } diff --git a/src/cypress/commands/fill/index.ts b/src/cypress/commands/fill/index.ts index 7acaec9fd..d6e0095be 100644 --- a/src/cypress/commands/fill/index.ts +++ b/src/cypress/commands/fill/index.ts @@ -23,7 +23,7 @@ import { assertStringArrayOrUndefined, assertStringOrUndefined } from './utils' -import { findElementBytext } from '../../utils/findElementBytext' +import { findElementByText } from '../../utils/findElementByText' import { throwError } from '../../utils/throwError' let TOTAL_RETRIES: number @@ -46,7 +46,7 @@ export function fill(label: string, value: any, options: Partial` element - const labelElement = findElementBytext('label', label) + const labelElement = findElementByText('label', label, { index: controlledOptions.index }) if (labelElement) { const fieldElement = findElementParentBySelector(labelElement, '.Element-Field') if (!fieldElement) { @@ -143,7 +143,7 @@ export function fill(label: string, value: any, options: Partial` element - const legendElement = findElementBytext('legend', label) + const legendElement = findElementByText('legend', label) if (legendElement) { const fieldsetElement = findElementParentBySelector(legendElement, '.Element-Fieldset') if (!fieldsetElement) { diff --git a/src/cypress/global.d.ts b/src/cypress/global.d.ts index f7deff5ef..26210656e 100644 --- a/src/cypress/global.d.ts +++ b/src/cypress/global.d.ts @@ -115,6 +115,7 @@ declare namespace Cypress { interface FillOptions extends Forceable { delay: number + index: number retries: number } } diff --git a/src/cypress/utils/findElementBytext.ts b/src/cypress/utils/findElementByText.ts similarity index 96% rename from src/cypress/utils/findElementBytext.ts rename to src/cypress/utils/findElementByText.ts index 2507da986..8a5db8ee7 100644 --- a/src/cypress/utils/findElementBytext.ts +++ b/src/cypress/utils/findElementByText.ts @@ -2,7 +2,7 @@ // instead of using a cleaner FP `.filter()` // but real experience made me think it greatly improves results stability. -export function findElementBytext( +export function findElementByText( selector: string, text: string, {