-
Notifications
You must be signed in to change notification settings - Fork 31
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix TextField and Callout TestSelectors #2303
base: main
Are you sure you want to change the base?
Conversation
@@ -44,27 +44,14 @@ export const TextFieldTestSelectors = { | |||
errorMessage: { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
unsure what to do with these features
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
label: ["errorMessage", "hint", "label"],
That'll fix it.
//labels ? something that is a child of the selector rather than a separate feature | ||
// text: { | ||
// selector: { | ||
// method: "ByText", | ||
// templateVariableNames: ["text"], | ||
// text: "${text}", | ||
// }, | ||
// }, | ||
// title: { | ||
// selector: { | ||
// method: "ByText", | ||
// templateVariableNames: ["title"], | ||
// text: "${title}", | ||
// }, | ||
// }, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
//labels ? something that is a child of the selector rather than a separate feature | |
// text: { | |
// selector: { | |
// method: "ByText", | |
// templateVariableNames: ["text"], | |
// text: "${text}", | |
// }, | |
// }, | |
// title: { | |
// selector: { | |
// method: "ByText", | |
// templateVariableNames: ["title"], | |
// text: "${title}", | |
// }, | |
// }, | |
// label: ["description", "title"], |
@@ -166,7 +166,7 @@ export const querySelector = <TestSelectors extends FeatureTestSelector>({ | |||
|
|||
return { | |||
element, | |||
select, | |||
selectChild, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
For anyone else looking at this PR, I asked for this renaming as we're gonna have a separate function for selecting labels.
}, | ||
}).element; | ||
|
||
expect(element).toHaveErrorMessage(/This field is required/); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We can probably have this quoted instead:
expect(element).toHaveErrorMessage(/This field is required/); | |
expect(element).toHaveErrorMessage("This field is required"); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
expect(element).toHaveErrorMessage(/This field is required:/); | ||
expect(element).toHaveErrorMessage(/At least 2 chars/); | ||
expect(element).toHaveErrorMessage(/No more than 20 chars/); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
These can all be in quotes.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@@ -246,6 +247,19 @@ export const Error: StoryObj<typeof TextField> = { | |||
errorMessage: "This field is required.", | |||
defaultValue: "", | |||
}, | |||
play: async ({ canvasElement, step }) => { | |||
await step("has visible label", async () => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
await step("has visible label", async () => { | |
await step("has visible error message", async () => { |
@@ -254,6 +268,21 @@ export const ErrorsList: StoryObj<typeof TextField> = { | |||
errorMessageList: ["At least 2 chars", "No more than 20 chars"], | |||
defaultValue: "", | |||
}, | |||
play: async ({ canvasElement, step }) => { | |||
await step("has visible label", async () => { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
await step("has visible label", async () => { | |
await step("has visible error messages", async () => { |
expect(element).toHaveAccessibleDescription( | ||
/Specify your destination within the Sol system./, | ||
); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
expect(element).toHaveAccessibleDescription( | |
/Specify your destination within the Sol system./, | |
); | |
expect(element).toHaveAccessibleDescription( | |
"Specify your destination within the Sol system.", | |
); |
I think the only places we can't use quotes are Callback
, Banner
, and Toast
.
f378f5e
to
5b8acf7
Compare
5b8acf7
to
7d9b038
Compare
7d9b038
to
071b444
Compare
Updated Test Selectors code is merged. |
OKTA-754200
Summary
Testing & Screenshots