From 6504847b262e8ece2f60d8ab71b69a03e7e2e94b Mon Sep 17 00:00:00 2001
From: Krzysztof G <60067306+gikf@users.noreply.github.com>
Date: Tue, 25 Apr 2023 10:11:23 +0200
Subject: [PATCH] fix(e2e): reduce test flakiness (#50072)

* fix: visit page before each test

* fix: ensure editor is visible when checking contents

* fix: click after clear
---
 cypress.config.js                             |  3 +-
 .../challenges/multifile-cert-project.ts      | 33 +++++++++++--------
 2 files changed, 21 insertions(+), 15 deletions(-)

diff --git a/cypress.config.js b/cypress.config.js
index c944e7de44a..aa29ef8ffe7 100644
--- a/cypress.config.js
+++ b/cypress.config.js
@@ -24,8 +24,7 @@ module.exports = defineConfig({
     // Temporary disable these until we can address the flakiness
     excludeSpecPattern: [
       'cypress/e2e/**/challenge-hot-keys.ts',
-      'cypress/e2e/**/multifile.ts',
-      'cypress/e2e/**/multifile-cert-project.ts'
+      'cypress/e2e/**/multifile.ts'
     ],
 
     setupNodeEvents(on, config) {
diff --git a/cypress/e2e/default/learn/challenges/multifile-cert-project.ts b/cypress/e2e/default/learn/challenges/multifile-cert-project.ts
index e5bc5b17989..dee2399c902 100644
--- a/cypress/e2e/default/learn/challenges/multifile-cert-project.ts
+++ b/cypress/e2e/default/learn/challenges/multifile-cert-project.ts
@@ -2,6 +2,7 @@ const save1text = 'save 1';
 const save2text = 'save 2';
 
 const editorElements = {
+  container: '.vertical .reflex-container',
   editor: '.react-monaco-editor-container',
   saveCodeBtn: '[data-cy="save-code-to-database-btn"]',
   closeFlash: '.close'
@@ -11,23 +12,28 @@ describe('multifileCertProjects', function () {
   before(() => {
     cy.exec('pnpm run seed');
     cy.login();
+  });
+
+  beforeEach(() => {
+    cy.preserveSession();
     cy.visit(
       'learn/responsive-web-design/responsive-web-design-projects/build-a-tribute-page'
     );
   });
 
-  beforeEach(() => {
-    cy.preserveSession();
-  });
-
   it('should save and reload user code', function () {
     // save to database (savedChallenges) when clicking save code button
-    cy.get(editorElements.editor).click().focused().clear().type(save1text);
+    cy.get(editorElements.container).find(editorElements.editor).click();
+    // Firefox somehow can lose focus after the .clear()
+    cy.focused().clear().click().type(save1text);
+    cy.get(editorElements.editor).contains(save1text);
     cy.get(editorElements.saveCodeBtn).click();
     cy.contains('Your code was saved to the database.');
     // load saved code on a hard refresh
     cy.reload();
-    cy.contains(save1text);
+    cy.get(editorElements.container)
+      .find(editorElements.editor)
+      .contains(save1text);
   });
 
   it('should save using ctrl+s hotkey and persist through navigation', function () {
@@ -36,21 +42,22 @@ describe('multifileCertProjects', function () {
     cy.exec('pnpm run seed');
     // and the redux store:
     cy.reload();
-    cy.get(editorElements.editor)
-      .click()
-      .focused()
-      .clear()
-      .type(`${save2text}{ctrl+s}`);
+    cy.get(editorElements.container).find(editorElements.editor).click();
+    cy.focused().clear().click().type(`${save2text}{ctrl+s}`);
+    cy.get(editorElements.editor).contains(save2text);
     cy.contains('Your code was saved to the database.');
     cy.get(editorElements.closeFlash).click();
     // load saved code when navigating site (no hard refresh)'
     cy.contains('Responsive Web Design Projects').click();
     cy.contains('In this Responsive Web Design Certification');
     cy.contains('Build a Tribute Page').click();
-    cy.contains(save2text);
+    cy.get(editorElements.container)
+      .find(editorElements.editor)
+      .contains(save2text);
     // trigger the warning about saving too quickly
     cy.reload();
-    cy.get(editorElements.editor)
+    cy.get(editorElements.container)
+      .find(editorElements.editor)
       .click()
       .focused()
       .type(`{ctrl+s}`)