From a7ec38bc79265f160dbec882a782255122f6045a Mon Sep 17 00:00:00 2001 From: Mark Date: Sun, 3 Nov 2024 14:47:53 -0500 Subject: [PATCH] feat: pass options to label assertions and queries --- src/actions/check.ts | 5 +++-- src/assertions/label.ts | 12 +++++++++--- src/constants/index.ts | 10 ++++++++++ src/queries/input.ts | 21 ++++++++++++++++++--- src/queries/label.ts | 16 +++++++++++++--- src/queries/textarea.ts | 21 ++++++++++++++++++--- src/utils/label.ts | 25 ++++++++++++++++--------- 7 files changed, 87 insertions(+), 23 deletions(-) diff --git a/src/actions/check.ts b/src/actions/check.ts index 0f76b5efa..7b451aec2 100644 --- a/src/actions/check.ts +++ b/src/actions/check.ts @@ -72,11 +72,12 @@ When('I check', When_I_check); * | scrollBehavior | top | * | timeout | 4000 | * | waitForAnimations | true | + * | pseudoSelector | visible | * ``` */ export function When_I_check_input(text: string, options?: DataTable) { - When_I_find_input_by_label_text(text); - getCypressElement().check(getOptions(options)); + When_I_find_input_by_label_text(text, options); + When_I_check(options); } When('I check input {string}', When_I_check_input); diff --git a/src/assertions/label.ts b/src/assertions/label.ts index f66d0bd0b..949e6f36c 100644 --- a/src/assertions/label.ts +++ b/src/assertions/label.ts @@ -1,7 +1,7 @@ import { DataTable, Then } from '@badeball/cypress-cucumber-preprocessor'; import { PseudoSelector } from '../constants'; -import { getLabelElements } from '../utils'; +import { getLabelElements, getOptions } from '../utils'; /** * Then I see label: @@ -33,7 +33,10 @@ import { getLabelElements } from '../utils'; * - {@link Then_I_see_text | Then I see text} */ export function Then_I_see_label(text: string, options?: DataTable) { - getLabelElements(text, PseudoSelector.visible, options).should('exist'); + getLabelElements(text, { + pseudoSelector: PseudoSelector.visible, + ...getOptions(options), + }).should('exist'); } Then('I see label {string}', Then_I_see_label); @@ -68,7 +71,10 @@ Then('I see label {string}', Then_I_see_label); * - {@link Then_I_do_not_see_text | Then I do not see text} */ export function Then_I_do_not_see_label(text: string, options?: DataTable) { - getLabelElements(text, PseudoSelector.visible, options).should('not.exist'); + getLabelElements(text, { + pseudoSelector: PseudoSelector.visible, + ...getOptions(options), + }).should('not.exist'); } Then('I do not see label {string}', Then_I_do_not_see_label); diff --git a/src/constants/index.ts b/src/constants/index.ts index cedaac642..c18a9fcf9 100644 --- a/src/constants/index.ts +++ b/src/constants/index.ts @@ -1,6 +1,16 @@ +/** + * @private + */ +export enum Element { + input = 'input', + textarea = 'textarea', +} + /** * @private */ export enum PseudoSelector { + hidden = 'hidden', + none = '', visible = 'visible', } diff --git a/src/queries/input.ts b/src/queries/input.ts index e777b0b0c..36cc580ee 100644 --- a/src/queries/input.ts +++ b/src/queries/input.ts @@ -1,5 +1,6 @@ -import { When } from '@badeball/cypress-cucumber-preprocessor'; +import { DataTable, When } from '@badeball/cypress-cucumber-preprocessor'; +import { Element } from '../constants'; import { getByLabelText, setCypressElement } from '../utils'; /** @@ -17,6 +18,17 @@ import { getByLabelText, setCypressElement } from '../utils'; * When I find input by label text "Email" * ``` * + * With [options](https://docs.cypress.io/api/commands/get#Arguments): + * + * ```gherkin + * When I find input by label text "Email" + * | log | true | + * | timeout | 4000 | + * | withinSubject | null | + * | includeShadowDom | false | + * | pseudoSelector | visible | + * ``` + * * @remarks * * This precedes steps like {@link Then_I_see_value | "Then I see value"}. For example: @@ -32,8 +44,11 @@ import { getByLabelText, setCypressElement } from '../utils'; * * - {@link When_I_find_element_by_label_text | When I find element by label text } */ -export function When_I_find_input_by_label_text(text: string) { - setCypressElement(getByLabelText('input', text)); +export function When_I_find_input_by_label_text( + text: string, + options?: DataTable, +) { + setCypressElement(getByLabelText(Element.input, text, options)); } When('I find input by label text {string}', When_I_find_input_by_label_text); diff --git a/src/queries/label.ts b/src/queries/label.ts index 0d037e31b..4f831191b 100644 --- a/src/queries/label.ts +++ b/src/queries/label.ts @@ -1,7 +1,7 @@ import { DataTable, When } from '@badeball/cypress-cucumber-preprocessor'; import { PseudoSelector } from '../constants'; -import { getLabelElements, setCypressElement } from '../utils'; +import { getLabelElements, getOptions, setCypressElement } from '../utils'; /** * When I find elements by label text: @@ -26,6 +26,7 @@ import { getLabelElements, setCypressElement } from '../utils'; * | timeout | 4000 | * | withinSubject | null | * | includeShadowDom | false | + * | pseudoSelector | visible | * ``` * * @remarks @@ -48,7 +49,12 @@ export function When_I_find_elements_by_label_text( text: string, options?: DataTable, ) { - setCypressElement(getLabelElements(text, PseudoSelector.visible, options)); + setCypressElement( + getLabelElements(text, { + pseudoSelector: PseudoSelector.visible, + ...getOptions(options), + }), + ); } When( @@ -79,6 +85,7 @@ When( * | timeout | 4000 | * | withinSubject | null | * | includeShadowDom | false | + * | pseudoSelector | visible | * ``` * * @remarks @@ -101,7 +108,10 @@ export function When_I_find_element_by_label_text( options?: DataTable, ) { setCypressElement( - getLabelElements(text, PseudoSelector.visible, options).first(), + getLabelElements(text, { + pseudoSelector: PseudoSelector.visible, + ...getOptions(options), + }).first(), ); } diff --git a/src/queries/textarea.ts b/src/queries/textarea.ts index 78c30464b..761433345 100644 --- a/src/queries/textarea.ts +++ b/src/queries/textarea.ts @@ -1,5 +1,6 @@ -import { When } from '@badeball/cypress-cucumber-preprocessor'; +import { DataTable, When } from '@badeball/cypress-cucumber-preprocessor'; +import { Element } from '../constants'; import { getByLabelText, setCypressElement } from '../utils'; /** @@ -17,6 +18,17 @@ import { getByLabelText, setCypressElement } from '../utils'; * When I find textarea by label text "Comments" * ``` * + * With [options](https://docs.cypress.io/api/commands/get#Arguments): + * + * ```gherkin + * When I find textarea by label text "Comments" + * | log | true | + * | timeout | 4000 | + * | withinSubject | null | + * | includeShadowDom | false | + * | pseudoSelector | visible | + * ``` + * * @remarks * * This precedes steps like {@link When_I_type | "When I type"}. For example: @@ -32,8 +44,11 @@ import { getByLabelText, setCypressElement } from '../utils'; * * - {@link When_I_find_element_by_label_text | When I find element by label text } */ -export function When_I_find_textarea_by_label_text(text: string) { - setCypressElement(getByLabelText('textarea', text)); +export function When_I_find_textarea_by_label_text( + text: string, + options?: DataTable, +) { + setCypressElement(getByLabelText(Element.textarea, text, options)); } When( diff --git a/src/utils/label.ts b/src/utils/label.ts index c27f42627..661ca3aa9 100644 --- a/src/utils/label.ts +++ b/src/utils/label.ts @@ -1,6 +1,6 @@ import { DataTable } from '@badeball/cypress-cucumber-preprocessor'; -import { PseudoSelector } from '../constants'; +import { Element } from '../constants'; import { When_I_find_element_by_label_text } from '../queries'; import { getCypressElement } from './element'; import { getOptions } from './options'; @@ -10,11 +10,16 @@ import { getOptions } from './options'; * * @param element - Element name. * @param text - Label text. + * @param options - Options. * @returns - Cypress element. * @private */ -export function getByLabelText(element: 'input' | 'textarea', text: string) { - When_I_find_element_by_label_text(text); +export function getByLabelText( + element: Element, + text: string, + options?: DataTable, +) { + When_I_find_element_by_label_text(text, options); return getCypressElement().then(($element: Cypress.JQueryWithSelector) => { const tagName = $element.prop('tagName').toLowerCase(); @@ -47,14 +52,13 @@ export function getByLabelText(element: 'input' | 'textarea', text: string) { * Get label elements. * * @param text - Label text. - * @param selector - Pseudo selector. + * @param options - Options. * @returns - Cypress element. * @private */ export function getLabelElements( text: string, - selector?: PseudoSelector, - options?: DataTable, + options?: ReturnType, ) { let selectors = [ `label:contains(${JSON.stringify(text)})`, @@ -62,9 +66,12 @@ export function getLabelElements( `[aria-label=${JSON.stringify(text)}]`, ]; - if (selector) { - selectors = selectors.map((label) => `${label}:${selector}`); + // @ts-expect-error Property 'pseudoSelector' does not exist on type 'object | undefined'. + const { pseudoSelector, ...opts } = options; + + if (pseudoSelector) { + selectors = selectors.map((label) => `${label}:${pseudoSelector}`); } - return cy.get(selectors.join(','), getOptions(options)); + return cy.get(selectors.join(','), opts); }