chore: add wait function to steps file

Videodock · Jun 5, 2024 · 2ab96b9 · 2ab96b9
1 parent 3c1b597
commit 2ab96b9
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 23 deletions.
diff --git a/packages/ui-react/src/components/Select/Select.tsx b/packages/ui-react/src/components/Select/Select.tsx
@@ -69,7 +69,9 @@ const Select = ({
 
   return (
     <div className={classNames({ [containerClassName]: editing })}>
-      <label htmlFor={id} className="hidden">{defaultLabel}</label>
+      <label htmlFor={id} className="hidden">
+        {defaultLabel}
+      </label>
       <select id={id} {...inputProps} onChange={handleChange}>
         {defaultLabel && (
           <option className={classNames(styles.option, optionsStyle)} value="" disabled={required}>

diff --git a/platforms/web/test-e2e/tests/accessibility_test.ts b/platforms/web/test-e2e/tests/accessibility_test.ts
@@ -11,61 +11,50 @@ const disableRetryFailedStep = (test: { disableRetryFailedStep: boolean }): void
   test.disableRetryFailedStep = true;
 };
 
-// The tests currently need a short `I.wait()` to ensure the pages are fully loaded before
-// performing the `checkA11y()` function. Ticket to improve this: https://videodock.atlassian.net/browse/OTT-1884
-
 Scenario('WCAG compliant - Home Page', async ({ I }) => {
   I.useConfig(testConfigs.basicNoAuth);
   I.amOnPage('/');
-  I.waitForLoaderDone();
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Video Detail Page', async ({ I }) => {
   I.useConfig(testConfigs.basicNoAuth);
   I.amOnPage('/m/awWEFyPu/big-buck-bunny');
-  I.wait(1.5);
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Playlist Page', async ({ I }) => {
-  await I.amOnPage('/p/dGSUzs9o/'); // "Films" page
-  I.wait(1);
+  I.amOnPage('/p/dGSUzs9o/'); // "Films" page
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Video Detail Inline Page', async ({ I }) => {
   I.useConfig(testConfigs.inlinePlayer);
   I.amOnPage('/m/awWEFyPu/big-buck-bunny');
-  I.wait(1.5);
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Search Page with results', async ({ I }) => {
   I.useConfig(testConfigs.basicNoAuth);
   I.amOnPage('/q/Caminandes');
-  I.wait(1);
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Search Page containing no results', async ({ I }) => {
   I.useConfig(testConfigs.basicNoAuth);
   I.amOnPage('/q/querywithoutresults');
-  I.wait(1);
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Player Page', async ({ I }) => {
   I.useConfig(testConfigs.basicNoAuth);
   I.amOnPage('/m/awWEFyPu/big-buck-bunny?r=dGSUzs9o&play=1');
-  I.wait(1);
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Live Page (EPG)', async ({ I }) => {
   I.useConfig(testConfigs.basicNoAuth);
   I.amOnPage('/p/fWpLtzVh/?channel=Uh7zcqVm/');
-  I.wait(2);
   I.checkA11y(null, {
     ignore: [
       // It is a known issue that the EPG is not fully accessible due to the planby EPG package
@@ -79,21 +68,18 @@ Scenario('WCAG compliant - Live Page (EPG)', async ({ I }) => {
 Scenario('WCAG compliant - Account Page', async ({ I }) => {
   I.useConfig(testConfigs.jwpAuth);
   I.amOnPage('/u/my-account');
-  I.wait(1);
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Payments Page', async ({ I }) => {
   I.useConfig(testConfigs.jwpAuth);
   I.amOnPage('/u/payments');
-  I.waitForLoaderDone();
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Favorites Page', async ({ I }) => {
   I.useConfig(testConfigs.jwpAuth);
   I.amOnPage('/u/favorites');
-  I.waitForLoaderDone();
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
@@ -102,21 +88,18 @@ Scenario('WCAG compliant - Favorites Page', async ({ I }) => {
 Scenario('WCAG compliant - Signup Modal - CLEENG', async ({ I }) => {
   I.useConfig(testConfigs.cleengAuthvod);
   I.amOnPage('/?u=create-account');
-  I.waitForLoaderDone();
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Sign in Modal - CLEENG', async ({ I }) => {
   I.useConfig(testConfigs.cleengAuthvod);
   I.amOnPage('/?u=login');
-  I.wait(1);
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Signup Modal - JWP', async ({ I }) => {
   I.useConfig(testConfigs.jwpAuth);
   I.amOnPage('/?u=create-account');
-  I.waitForLoaderDone();
   I.checkA11y({
     rules: {
       // This rule is disabled because this component does have a label prop,
@@ -131,16 +114,12 @@ Scenario('WCAG compliant - Signup Modal - JWP', async ({ I }) => {
 Scenario('WCAG compliant - Sign in Modal - JWP', async ({ I }) => {
   I.useConfig(testConfigs.jwpAuth);
   I.amOnPage('/?u=login');
-  I.wait(1);
   I.checkA11y();
 }).config(disableRetryFailedStep);
 
 Scenario('WCAG compliant - Choose Offer Modal', async ({ I }) => {
   I.useConfig(testConfigs.svod);
   paidLoginContext = await I.registerOrLogin(paidLoginContext);
   I.amOnPage(constants.offersUrl);
-
-  I.wait(1.5);
-
   I.checkA11y();
 }).config(disableRetryFailedStep);
diff --git a/platforms/web/test-e2e/utils/steps_file.ts b/platforms/web/test-e2e/utils/steps_file.ts
@@ -549,6 +549,7 @@ const stepsObj = {
   },
   checkA11y: function (context?: ElementContext | null, options: AccessbilityOptions = {}) {
     const debug = process.argv.includes('--debug');
+    this.wait(2); // We wait to ensure the page is fully loaded so we don't get flaky a11y violations
     this.usePlaywrightTo('Run accessibility tests', async ({ page }) => {
       await injectAxe(page);
       const violations = await getViolations(page, context || undefined);