From 64e9e7fcda79e8e354a783aeff66d69ad6d79faf Mon Sep 17 00:00:00 2001
From: John McLear <john@mclear.co.uk>
Date: Mon, 1 Mar 2021 14:31:55 +0000
Subject: [PATCH] tests:  Frontend test Windows ZIP (#4894)

* tests:  Frontend test Windows ZIP

This PR introduces Frontend testing within Github actions!

We're depending a lot on saucelabs recently and that's fine but sometimes we just want to quickly do a frontend simple test on a weird environment (IE windows build) so this PR solves that problem.

Things to note.

    It still builds the windows .zip if the cypress tests fail.
    It does not add any heavy deps to Etherpad as cypress must be installed in CI.
    Cypress is responsible for running the Etherpad instance.

It's up to us how much we use this or not, I know it introduces a bunch of technical debt but I tried to keep that a minimum by compartmentalizing things and documenting where required.

* Update .github/workflows/windows-zip.yml

Co-authored-by: Richard Hansen <rhansen@rhansen.org>

* remove timeouts

* Move folder structure up a level

* Update windows-zip.yml

* Update test.js

Co-authored-by: Richard Hansen <rhansen@rhansen.org>
---
 .github/workflows/windows-zip.yml             |  6 +++--
 src/tests/frontend/cypress/.gitignore         |  5 +++++
 src/tests/frontend/cypress/README.md          | 10 +++++++++
 src/tests/frontend/cypress/cypress.json       |  3 +++
 .../frontend/cypress/integration/test.js      | 22 +++++++++++++++++++
 5 files changed, 44 insertions(+), 2 deletions(-)
 create mode 100644 src/tests/frontend/cypress/.gitignore
 create mode 100644 src/tests/frontend/cypress/README.md
 create mode 100644 src/tests/frontend/cypress/cypress.json
 create mode 100644 src/tests/frontend/cypress/integration/test.js

diff --git a/.github/workflows/windows-zip.yml b/.github/workflows/windows-zip.yml
index 6e5f80bd..42a99a19 100644
--- a/.github/workflows/windows-zip.yml
+++ b/.github/workflows/windows-zip.yml
@@ -65,11 +65,13 @@ jobs:
     - name: Extract Etherpad
       run: 7z x etherpad-lite-win.zip -oetherpad
 
-    - name: list
-      run: dir etherpad
+    - name: Install Cypress
+      run: npm install cypress -g
 
     - name: Run Etherpad
       run: |
             cd etherpad
             node node_modules\ep_etherpad-lite\node\server.js &
             curl --connect-timeout 10 --max-time 20 --retry 5 --retry-delay 10 --retry-max-time 60 --retry-connrefused http://127.0.0.1:9001/p/test
+            cd src\tests\frontend
+            cypress run --spec cypress\integration\test.js --config-file cypress\cypress.json
diff --git a/src/tests/frontend/cypress/.gitignore b/src/tests/frontend/cypress/.gitignore
new file mode 100644
index 00000000..b3bf4d3e
--- /dev/null
+++ b/src/tests/frontend/cypress/.gitignore
@@ -0,0 +1,5 @@
+fixtures/*
+plugins/*
+support/*
+videos/*
+screenshots/*
diff --git a/src/tests/frontend/cypress/README.md b/src/tests/frontend/cypress/README.md
new file mode 100644
index 00000000..4cc3f812
--- /dev/null
+++ b/src/tests/frontend/cypress/README.md
@@ -0,0 +1,10 @@
+# Cypress Etherpad guide
+We don't install Etherpad as a dev dep or dep within Etherpad because it's not
+our core Frontend testing tool
+
+## Quick start
+```
+npm i -g cypress
+cd src/tests/frontend/cypress/
+cypress open
+```
diff --git a/src/tests/frontend/cypress/cypress.json b/src/tests/frontend/cypress/cypress.json
new file mode 100644
index 00000000..780d73fa
--- /dev/null
+++ b/src/tests/frontend/cypress/cypress.json
@@ -0,0 +1,3 @@
+{
+  "baseUrl": "http://127.0.0.1:9001"
+}
diff --git a/src/tests/frontend/cypress/integration/test.js b/src/tests/frontend/cypress/integration/test.js
new file mode 100644
index 00000000..300a555d
--- /dev/null
+++ b/src/tests/frontend/cypress/integration/test.js
@@ -0,0 +1,22 @@
+'use strict';
+
+Cypress.Commands.add('iframe', {prevSubject: 'element'},
+    ($iframe) => new Cypress.Promise((resolve) => {
+      $iframe.ready(() => {
+        resolve($iframe.contents().find('body'));
+      });
+    }));
+
+describe(__filename, () => {
+  it('Pad content exists', async () => {
+    cy.visit('http://127.0.0.1:9001/p/test');
+    cy.get('iframe[name="ace_outer"]', {timeout: 10000}).iframe()
+        .find('.line-number:first')
+        .should('have.text', '1');
+    cy.get('iframe[name="ace_outer"]').iframe()
+        .find('iframe[name="ace_inner"]').iframe()
+        .find('.ace-line:first')
+        .should('be.visible')
+        .should('have.text', 'Welcome to Etherpad!');
+  });
+});