From 53dea2fe8052e8dcf5cb066c629bb478e98d0db5 Mon Sep 17 00:00:00 2001 From: Thonier Florian Date: Wed, 22 Sep 2021 17:20:22 +0200 Subject: [PATCH 01/10] cypress, update make rules and doc --- Makefile | 43 ++++++++++++++++++++++++++++--------------- doc/dev-client.md | 16 +++++++++------- 2 files changed, 37 insertions(+), 22 deletions(-) diff --git a/Makefile b/Makefile index dfa746306..508007ef3 100644 --- a/Makefile +++ b/Makefile @@ -64,30 +64,43 @@ build_cypress_image: functional_browser_cypress_open: # Need to create a symbolic link; but allow to directly see result # Usefull for fast debugging; allow to launch script one by one - cypress open --env workdir=$(PWD),host=local + rm -r cypress + ln -s browser/test/cypress + cypress open --env workdir=../,host=localhost + functional_browser_cypress: docker run \ - -v $(PWD)/browser/test/cypress:/app/cypress \ - -v $(PWD)/browser/test/data/:/app/cypress/fixtures/data/ \ - -v $(PWD)/doc/:/app/cypress/fixtures/doc/ \ - -v $(PWD):/app/vidjil \ - -v "$(PWD)/docker/ci/cypress_script.bash":"/app/script.bash" \ - -v "$(PWD)/docker/ci/cypress.json":"/app/cypress.json" \ - --env BROWSER=electron --env HOST=local "vidjilci/cypress_with_browsers:latest" bash script.bash + -v `pwd`/browser/test/cypress:/app/cypress \ + -v `pwd`/browser/test/data/:/app/cypress/fixtures/data/ \ + -v `pwd`/doc/:/app/cypress/fixtures/doc/ \ + -v `pwd`/demo/:/app/cypress/fixtures/demo/ \ + -v `pwd`:/app/vidjil \ + -v "`pwd`/docker/ci/cypress_script.bash":"/app/script.bash" \ + -v "`pwd`/docker/ci/script_preprocess.bash":"/app/script_preprocess.bash" \ + -v "`pwd`/docker/ci/cypress.json":"/app/cypress.json" \ + --env BROWSER=electron --env HOST=localhost "vidjilci/cypress_with_browsers:latest" bash script.bash functional_server_cypress_open: - cypress open --env workdir=$(PWD),host=local --project ./server/web2py/applications/vidjil/tests + ln -sf server/web2py/applications/vidjil/tests/cypress/ . + rm -r cypress/fixtures cypress/plugins cypress/support || true + ln -sf ../../../../../../browser/test/cypress/fixtures cypress/fixtures + ln -sf ../../../../../../browser/test/cypress/plugins cypress/plugins + ln -sf ../../../../../../browser/test/cypress/support cypress/support + cypress open --env workdir=../,host=local + functional_server_cypress: # Need to have a local server deploy with the ci data integrated docker run \ - -v $(PWD)/server/web2py/applications/vidjil/tests/cypress:/app/cypress \ - -v $(PWD)/browser/test/data/:/app/cypress/fixtures/data/ \ - -v $(PWD)/doc/:/app/cypress/fixtures/doc/ \ - -v $(PWD):/app/vidjil \ - -v "$(PWD)/docker/ci/cypress_script.bash":"/app/script.bash" \ - -v "$(PWD)/docker/ci/cypress.json":"/app/cypress.json" \ + -v `pwd`/browser/test/cypress:/app/cypress \ + -v `pwd`/browser/test/data/:/app/cypress/fixtures/data/ \ + -v `pwd`/doc/:/app/cypress/fixtures/doc/ \ + -v `pwd`/demo/:/app/cypress/fixtures/demo/ \ + -v `pwd`:/app/vidjil \ + -v "`pwd`/docker/ci/cypress_script.bash":"/app/script.bash" \ + -v "`pwd`/docker/ci/script_preprocess.bash":"/app/script_preprocess.bash" \ + -v "`pwd`/docker/ci/cypress.json":"/app/cypress.json" \ --network="host" \ --env BROWSER=electron --env HOST=local "vidjilci/cypress_with_browsers:latest" bash script.bash diff --git a/doc/dev-client.md b/doc/dev-client.md index adaeefc51..c0335ffeb 100644 --- a/doc/dev-client.md +++ b/doc/dev-client.md @@ -672,13 +672,15 @@ See the makefile rule `functional_browser_cypress`. This rule launch the next command: ```bash docker run \ - -v $(PWD)/browser/test/cypress:/app/cypress \ - -v $(PWD)/browser/test/data/:/app/cypress/fixtures/data/ \ - -v $(PWD)/doc/:/app/cypress/fixtures/doc/ \ - -v $(PWD):/app/vidjil \ - -v "$(PWD)/docker/ci/cypress_script.bash":"/app/script.bash" \ - -v "$(PWD)/docker/ci/cypress.json":"/app/cypress.json" \ - --env BROWSER=electron --env HOST=local "vidjilci/cypress_with_browsers:latest" bash script.bash + -v `pwd`/browser/test/cypress:/app/cypress \ + -v `pwd`/browser/test/data/:/app/cypress/fixtures/data/ \ + -v `pwd`/doc/:/app/cypress/fixtures/doc/ \ + -v `pwd`/demo/:/app/cypress/fixtures/demo/ \ + -v `pwd`:/app/vidjil \ + -v "`pwd`/docker/ci/cypress_script.bash":"/app/script.bash" \ + -v "`pwd`/docker/ci/script_preprocess.bash":"/app/script_preprocess.bash" \ + -v "`pwd`/docker/ci/cypress.json":"/app/cypress.json" \ + --env BROWSER=electron --env HOST=localhost "vidjilci/cypress_with_browsers:latest" bash script.bash ``` Various local volumes are mounted for these tests. -- GitLab From 8a4f784ccffdd49c7485818698a66540aefc5ca2 Mon Sep 17 00:00:00 2001 From: Thonier Florian Date: Wed, 22 Sep 2021 17:45:35 +0200 Subject: [PATCH 02/10] cypress; update doc --- doc/dev-client.md | 6 +++++- doc/dev-server.md | 36 ++++++++++++++++++++++++++++++++++++ 2 files changed, 41 insertions(+), 1 deletion(-) diff --git a/doc/dev-client.md b/doc/dev-client.md index c0335ffeb..9b7498118 100644 --- a/doc/dev-client.md +++ b/doc/dev-client.md @@ -690,7 +690,11 @@ In this directory you can find scripts of `support` (shared functions), `fixture 3. Interactive mode For interactive mode, Cypress should be installed on local computer and some symbolic links should be created. -More informations will be provided next. +All actions for linking are made by the rule `functional_browser_cypress_open` of the makefile. +To open the GUI and select tests to launch, command will be: +```bash +make functional_browser_cypress_open +``` 4. Troubleshooting diff --git a/doc/dev-server.md b/doc/dev-server.md index 132794fe8..5cbdd687b 100644 --- a/doc/dev-server.md +++ b/doc/dev-server.md @@ -629,3 +629,39 @@ echo "Uninstall certificates for $BRANCH" rm -f $DIR/$BRANCH/docker_$BRANCH/vidjil-client/ssl/web2py.{ctr,info,key} rm -f ~/nginx/certs/$BRANCH.ci.vidjil.org.crt ~/nginx/certs/$BRANCH.ci.vidjil.org.info ~/nginx/certs/$BRANCH.ci.vidjil.org.key ``` + + + +### Functional with cypress (release candidate) + +To avoid `Watir` limitation on latest versions of browsers, we adopt [Cypress](https://docs.cypress.io/guides/overview/why-cypress#In-a-nutshell). +The testing pipeline is build on a docker image which include chrome and firefox browser in differents version; +It is now used to launch pipeline for client and for server aspect. +See [dev_client.md] for more informations on cypress pipeline. + +To launch these pipeline, a vidjil server should be available at localhost. +Adress should be updated if you use https or http (see troubleshooting section). + +1. Usage in cli + +```bash +make functional_server_cypress +``` + +2. Interactive mode + +For interactive mode, Cypress should be installed on local computer and some symbolic links should be created. +All actions for linking are made by the rule `functional_server_cypress_open` of the makefile. +To open the GUI and select tests to launch, command will be: + +```bash +make functional_server_cypress_open +``` + +3. Troubleshooting + + 1. visit error + + By default, test on CI are launch on a http adress. + Cypress take into account this and try to visit localhost as a http. + If an error occur, you should modify the url in `browser/test/cypress/support/login.js` to change `http` to `https`. \ No newline at end of file -- GitLab From 5a4aedb0bb0e151b425a6e048c4a400f5cd216a0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mika=C3=ABl=20Salson?= Date: Fri, 24 Sep 2021 10:50:23 +0000 Subject: [PATCH 03/10] Apply 1 suggestion(s) to 1 file(s) --- Makefile | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/Makefile b/Makefile index 508007ef3..602d66811 100644 --- a/Makefile +++ b/Makefile @@ -64,8 +64,7 @@ build_cypress_image: functional_browser_cypress_open: # Need to create a symbolic link; but allow to directly see result # Usefull for fast debugging; allow to launch script one by one - rm -r cypress - ln -s browser/test/cypress + ln -sf browser/test/cypress cypress open --env workdir=../,host=localhost functional_browser_cypress: -- GitLab From fc1ca61965c650a6f270ecc9c9e173e55d3f0c52 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mika=C3=ABl=20Salson?= Date: Fri, 24 Sep 2021 10:51:22 +0000 Subject: [PATCH 04/10] Apply 1 suggestion(s) to 1 file(s) --- doc/dev-client.md | 1 + 1 file changed, 1 insertion(+) diff --git a/doc/dev-client.md b/doc/dev-client.md index 9b7498118..50f9c07ba 100644 --- a/doc/dev-client.md +++ b/doc/dev-client.md @@ -672,6 +672,7 @@ See the makefile rule `functional_browser_cypress`. This rule launch the next command: ```bash docker run \ + --user $(id -u):$(id -g) \ -v `pwd`/browser/test/cypress:/app/cypress \ -v `pwd`/browser/test/data/:/app/cypress/fixtures/data/ \ -v `pwd`/doc/:/app/cypress/fixtures/doc/ \ -- GitLab From b8475cfda8b7ad8cf1428ab8ad9a1eff7bae5158 Mon Sep 17 00:00:00 2001 From: Thonier Florian Date: Fri, 24 Sep 2021 13:16:07 +0200 Subject: [PATCH 05/10] cypress, add a sandbox script for fast debugging --- .../test/cypress/integration/test_sandbox.js | 26 +++++++++++++++++++ doc/dev-client.md | 2 ++ 2 files changed, 28 insertions(+) create mode 100644 browser/test/cypress/integration/test_sandbox.js diff --git a/browser/test/cypress/integration/test_sandbox.js b/browser/test/cypress/integration/test_sandbox.js new file mode 100644 index 000000000..f0b2eaf61 --- /dev/null +++ b/browser/test/cypress/integration/test_sandbox.js @@ -0,0 +1,26 @@ +/// + +var localhost = true +console.log( Cypress.env('workdir') ) +var url = "./"+ Cypress.env('workdir')+"/browser/index.html" +console.log( url ) + +// This script allow to make some action in a sandbox to quicly change made on the client when you code +describe('Test sandbox', function () { + beforeEach(function () { + cy.setBrowser(url) + }) + + + it('00-sandbox', function() { + // First, you probably want to open an analysis + cy.openAnalysis("doc/analysis-example2.vidjil", "doc/analysis-example2.analysis") + // or without analysis + // cy.openAnalysis("doc/analysis-example2.vidjil") + + // After that, do some action ... + cy.get('.button > .icon-info').click() + + return + }) +}) diff --git a/doc/dev-client.md b/doc/dev-client.md index 50f9c07ba..3fc842839 100644 --- a/doc/dev-client.md +++ b/doc/dev-client.md @@ -697,6 +697,8 @@ To open the GUI and select tests to launch, command will be: make functional_browser_cypress_open ``` +A test_sandbox is avalaible to quicly test some modification made in the browser. See file `test_sandbox.js` and other script file for fast developpment. + 4. Troubleshooting 1. Xvfb error -- GitLab From 3b57dc42bbb961f6fe1ea9f5f3f7821841defcce Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mika=C3=ABl=20Salson?= Date: Fri, 24 Sep 2021 10:50:23 +0000 Subject: [PATCH 06/10] Apply 1 suggestion(s) to 1 file(s) --- Makefile | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/Makefile b/Makefile index 508007ef3..602d66811 100644 --- a/Makefile +++ b/Makefile @@ -64,8 +64,7 @@ build_cypress_image: functional_browser_cypress_open: # Need to create a symbolic link; but allow to directly see result # Usefull for fast debugging; allow to launch script one by one - rm -r cypress - ln -s browser/test/cypress + ln -sf browser/test/cypress cypress open --env workdir=../,host=localhost functional_browser_cypress: -- GitLab From 17070c94b6ee0bd77aac0f886ef082f08f5ebd7d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mika=C3=ABl=20Salson?= Date: Fri, 24 Sep 2021 10:51:22 +0000 Subject: [PATCH 07/10] Apply 1 suggestion(s) to 1 file(s) --- doc/dev-client.md | 1 + 1 file changed, 1 insertion(+) diff --git a/doc/dev-client.md b/doc/dev-client.md index 9b7498118..50f9c07ba 100644 --- a/doc/dev-client.md +++ b/doc/dev-client.md @@ -672,6 +672,7 @@ See the makefile rule `functional_browser_cypress`. This rule launch the next command: ```bash docker run \ + --user $(id -u):$(id -g) \ -v `pwd`/browser/test/cypress:/app/cypress \ -v `pwd`/browser/test/data/:/app/cypress/fixtures/data/ \ -v `pwd`/doc/:/app/cypress/fixtures/doc/ \ -- GitLab From 94cbdbcbe2059c447406740a63e6c74c0677e40e Mon Sep 17 00:00:00 2001 From: Thonier Florian Date: Fri, 24 Sep 2021 13:16:07 +0200 Subject: [PATCH 08/10] cypress, add a sandbox script for fast debugging --- .../test/cypress/integration/test_sandbox.js | 26 +++++++++++++++++++ doc/dev-client.md | 2 ++ 2 files changed, 28 insertions(+) create mode 100644 browser/test/cypress/integration/test_sandbox.js diff --git a/browser/test/cypress/integration/test_sandbox.js b/browser/test/cypress/integration/test_sandbox.js new file mode 100644 index 000000000..f0b2eaf61 --- /dev/null +++ b/browser/test/cypress/integration/test_sandbox.js @@ -0,0 +1,26 @@ +/// + +var localhost = true +console.log( Cypress.env('workdir') ) +var url = "./"+ Cypress.env('workdir')+"/browser/index.html" +console.log( url ) + +// This script allow to make some action in a sandbox to quicly change made on the client when you code +describe('Test sandbox', function () { + beforeEach(function () { + cy.setBrowser(url) + }) + + + it('00-sandbox', function() { + // First, you probably want to open an analysis + cy.openAnalysis("doc/analysis-example2.vidjil", "doc/analysis-example2.analysis") + // or without analysis + // cy.openAnalysis("doc/analysis-example2.vidjil") + + // After that, do some action ... + cy.get('.button > .icon-info').click() + + return + }) +}) diff --git a/doc/dev-client.md b/doc/dev-client.md index 50f9c07ba..3fc842839 100644 --- a/doc/dev-client.md +++ b/doc/dev-client.md @@ -697,6 +697,8 @@ To open the GUI and select tests to launch, command will be: make functional_browser_cypress_open ``` +A test_sandbox is avalaible to quicly test some modification made in the browser. See file `test_sandbox.js` and other script file for fast developpment. + 4. Troubleshooting 1. Xvfb error -- GitLab From dafe2465ba3549708198eb40ec97a9a32aca1281 Mon Sep 17 00:00:00 2001 From: Mathieu Giraud Date: Fri, 1 Oct 2021 09:18:10 +0200 Subject: [PATCH 09/10] doc/dev-client.md: typos, bikeshedding --- doc/dev-client.md | 46 +++++++++++++++++++++++++--------------------- 1 file changed, 25 insertions(+), 21 deletions(-) diff --git a/doc/dev-client.md b/doc/dev-client.md index 3fc842839..7ae562d51 100644 --- a/doc/dev-client.md +++ b/doc/dev-client.md @@ -636,23 +636,23 @@ webpage. you may be interested to use the [redirection over SSH](https://en.wikipedia.org/wiki/Xvfb#Remote_control_over_SSH). -### Functional with cypress (release candidate) +### Functional tests with cypress -To avoid `Watir` limitation on latest versions of browsers, we adopt [Cypress](https://docs.cypress.io/guides/overview/why-cypress#In-a-nutshell). -The testing pipeline is build on a docker image which include chrome and firefox browser in differents version; +The [Cypress](https://docs.cypress.io/guides/overview/why-cypress#In-a-nutshell) +testing pipeline is build on a Docker image which include the following Chrome and Firefox browsers: -| | firefox | Chromium | +| | Firefox | Chromium | |:-----------------------------|:--------|:------------| |Legacy (until september 2021) | 62.0 | 75.0.3770.0 | |Supported | 78.0 | 79.0.3945.0 | |Latest (as at june 2021) | 89.0 | 93.0.4524.0 | -We will progressivly convert Watir tests on Cypress. +We will progressivly convert historic Watir tests toward Cypress. -1. Instalation +1. Installation -The docker image to used can be build from local repository, or downloaded from dockerhub repository. -Docker should be installed for these tests. +Install Docker, then either build locally the Docker image, +or download it from dockerhub 1. Local build @@ -667,9 +667,9 @@ Docker should be installed for these tests. 2. Usage -The default usage of cypress pipeline use docker image and is launch in headless mode. -See the makefile rule `functional_browser_cypress`. -This rule launch the next command: +By default, the cypress pipeline is launched in headless mode. +The makefile rule `make functional_browser_cypress` launches the following command: + ```bash docker run \ --user $(id -u):$(id -g) \ @@ -684,34 +684,38 @@ This rule launch the next command: --env BROWSER=electron --env HOST=localhost "vidjilci/cypress_with_browsers:latest" bash script.bash ``` -Various local volumes are mounted for these tests. -Tests scripts are located in `browser/test/cypress`. -In this directory you can find scripts of `support` (shared functions), `fixtures` (datas used during tests) and finally `integration` (testing scripts). +Local volumes are mounted for these tests. +Tests scripts are located in `browser/test/cypress`: + - `support` (shared functions) + - `fixtures` (data used during tests) + - `integration` (testing scripts) 3. Interactive mode -For interactive mode, Cypress should be installed on local computer and some symbolic links should be created. -All actions for linking are made by the rule `functional_browser_cypress_open` of the makefile. -To open the GUI and select tests to launch, command will be: +The interactive mode allows to select tests to be launched. +Cypress has to be installed on local computer. +The following command creates some links and open the GUI: ```bash make functional_browser_cypress_open ``` -A test_sandbox is avalaible to quicly test some modification made in the browser. See file `test_sandbox.js` and other script file for fast developpment. +A `test_sandbox` is available to quickly test some modification made in the browser. See file `test_sandbox.js` and other script file for fast developpment. 4. Troubleshooting 1. Xvfb error - Sometime during developpement, the cypress pipeline can failed. In some case, the XVDB server can still open after test ending and the docker image still open. + The cypress pipeline may fail in some cases, when, after the end of the tests, + the Xvfb server and the docker container are still running. In this case, stop the docker container. ```bash docker ps docker stop $container_id ``` - 2. Right error on produced files (report and screenshot) - Files produced by cypress docker are made with root right. These files should be deleted with root privilege. + 2. Permission errors on report and screenshot files + Files produced by cypress docker belong to the root user. + These files should be deleted with root privilege. ```bash sudo rm -r browser/test/cypress/report browser/test/cypress/screenshots ``` \ No newline at end of file -- GitLab From 5229bb2a0e3b5264cfb4229da82ca4cce91182d7 Mon Sep 17 00:00:00 2001 From: flothoni Date: Fri, 1 Oct 2021 17:28:52 +0200 Subject: [PATCH 10/10] Fix typo error in makefile Add link to server volume of cypress tests --- Makefile | 1 + 1 file changed, 1 insertion(+) diff --git a/Makefile b/Makefile index 602d66811..247b9324e 100644 --- a/Makefile +++ b/Makefile @@ -93,6 +93,7 @@ functional_server_cypress: # Need to have a local server deploy with the ci data integrated docker run \ -v `pwd`/browser/test/cypress:/app/cypress \ + -v `pwd`/server/web2py/applications/vidjil/tests/cypress/integration:/app/cypress/integration \ -v `pwd`/browser/test/data/:/app/cypress/fixtures/data/ \ -v `pwd`/doc/:/app/cypress/fixtures/doc/ \ -v `pwd`/demo/:/app/cypress/fixtures/demo/ \ -- GitLab