Pull request #39: chore(e2e): playwright instead of puppeteer

Merge in WS/iink-js from playwright to master

* commit '25c39df140cc212f84395b450f1155cc0f73b6cd':
  chore(e2e): playwright instead of puppeteer

Author: leJsboureau

.mocharc.e2e.env.js

@@ -0,0 +1,3 @@
+process.env.LAUNCH_URL = process.env.LAUNCH_URL || 'http://localhost:8080'
+process.env.HEADLESS = true
+process.env.BROWSER = process.env.BROWSER || 'chromium'

.mocharc.e2e.js

@@ -0,0 +1,9 @@
+module.exports = {
+  exit: false,
+  recursive: true,
+  spec: './test/playwright/*.spec.js',
+  require: '.mocharc.e2e.env.js,./test/playwright/helper/mochaHooks.js',
+  timeout: 30000,
+  parallel: false,
+  reporter: 'spec'
+}

Jenkinsfile

@@ -30,12 +30,39 @@ pipeline {
         }
       }
 
-      stage ('test'){
+      stage ('init_examples'){
         steps {
-          sh "make ${env.MAKE_ARGS} test-e2e"
+          sh "make ${env.MAKE_ARGS} init_examples"
         }
       }
 
+      stage('test browser') {
+
+        failFast false
+
+        parallel {
+          
+          stage ('test-chromium'){
+            steps {
+              sh "BROWSER=chromium make ${env.MAKE_ARGS} test-e2e"
+            }
+          }
+
+          stage ('test-webkit'){
+            steps {
+              sh "BROWSER=webkit make ${env.MAKE_ARGS} test-e2e"
+            }
+          }
+
+          stage ('test-firefox'){
+            steps {
+              sh "BROWSER=firefox make ${env.MAKE_ARGS} test-e2e"
+            }
+          }
+        }
+
+      }
+
       stage ('audit'){
           steps {
             sh "npm audit --production"

Makefile

@@ -12,7 +12,7 @@ clean: ## Remove all produced binaries.
 	@rm -rf docs
 
 prepare: ## Install all dependencies.
-	@PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true npm install
+	@PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD=1 npm install
 
 build: clean ## Building the dist files from sources.
 	@npm run build
@@ -26,40 +26,55 @@ docker: build ## Build the docker image containing last version of myscript-js a
 	@cp -R dist docker/examples/delivery/
 	@cp -R examples docker/examples/delivery/
 	@cp -R node_modules docker/examples/delivery/
-	@cd docker/examples/ && docker build --build-arg applicationkey=${DEV_APPLICATIONKEY} --build-arg hmackey=${DEV_HMACKEY} $(DOCKER_PARAMETERS) -t $(EXAMPLES_DOCKERREPOSITORY) .
+	@cd docker/examples/ && \
+		docker build \
+		--build-arg applicationkey=${DEV_APPLICATIONKEY} \
+		--build-arg hmackey=${DEV_HMACKEY} $(DOCKER_PARAMETERS) -t $(EXAMPLES_DOCKERREPOSITORY) .
 
 killdocker:
 	@docker ps -a | grep "iinkjs-$(DOCKERTAG)-$(BUILDENV)-" | awk '{print $$1}' | xargs -r docker rm -f 2>/dev/null 1>/dev/null || true
 
-test-e2e: killdocker _examples
-	docker pull $(PUPPETEER_DOCKERREPOSITORY)
-	if [[ $(DEVLOCAL) == true ]]; then \
+
+local-test-e2e: init_examples
+	@$(MAKE) BROWSER=$(BROWSER) test-e2e
+ 
+test-e2e: 
+	@if [[ $(DEVLOCAL) == true ]]; then \
 		EXAMPLES_IP=localhost; \
 	else \
 		EXAMPLES_IP=$$(docker inspect --format '{{ .NetworkSettings.IPAddress }}' $(TEST_DOCKER_EXAMPLES_INSTANCE_NAME)); \
 	fi && \
 	docker run -i --rm \
 		-v $(CURRENT_PWD):/tests \
 		-e LAUNCH_URL="http://$${EXAMPLES_IP}:$(EXAMPLES_LISTEN_PORT)" \
-		--user=$(CURRENT_USER_UID) \
-		--userns=host \
-		--net=host \
-		$(PUPPETEER_DOCKERREPOSITORY)
+		-e BROWSER=$(BROWSER) \
+		--ipc=host \
+		-w "/tests" \
+		--name "playwright-$(BROWSER)" mcr.microsoft.com/playwright:bionic \
+		npm run test:e2e
 
 dev-all: dev-examples ## Launch all the requirements for launching tests.
 
-dev-examples: _examples ## Launch a local nginx server to ease development.
+dev-examples: init_examples ## Launch a local nginx server to ease development.
 
-_examples:
+_launch_examples:
 	@echo "Starting examples container!"
-	docker run -d --name $(TEST_DOCKER_EXAMPLES_INSTANCE_NAME) $(DOCKER_EXAMPLES_PARAMETERS) \
+	@docker run -d \
 	  -e "LISTEN_PORT=$(EXAMPLES_LISTEN_PORT)" \
-		-e "APISCHEME=$(APISCHEME)" \
+		-e "APISCHEME=$(APISCHEME)" \
 		-e "APIHOST=$(APIHOST)" \
-        -e "APPLICATIONKEY=$(DEV_APPLICATIONKEY)" \
-        -e "HMACKEY=$(DEV_HMACKEY)" \
-		$(EXAMPLES_DOCKERREPOSITORY)
-	@docker run --rm --link $(TEST_DOCKER_EXAMPLES_INSTANCE_NAME):WAITHOST -e "WAIT_PORT=$(EXAMPLES_LISTEN_PORT)" -e "WAIT_SERVICE=Test examples" $(WAITTCP_DOCKERREPOSITORY)
+		-e "APPLICATIONKEY=$(DEV_APPLICATIONKEY)" \
+		-e "HMACKEY=$(DEV_HMACKEY)" \
+		$(DOCKER_EXAMPLES_PARAMETERS) \
+		--name $(TEST_DOCKER_EXAMPLES_INSTANCE_NAME) $(EXAMPLES_DOCKERREPOSITORY)
+_check_examples: 
+	@docker run --rm \
+		--link $(TEST_DOCKER_EXAMPLES_INSTANCE_NAME):WAITHOST \
+		-e "WAIT_PORT=$(EXAMPLES_LISTEN_PORT)" \
+		-e "WAIT_SERVICE=Test examples" \
+		$(WAITTCP_DOCKERREPOSITORY)
+	@echo "Examples started!"
+init_examples: _launch_examples _check_examples
 
 help: ## This help.
 	@awk 'BEGIN {FS = ":.*?## "} /^[a-zA-Z_-]+:.*?## / {printf "\033[36m%-30s\033[0m %s\n", $$1, $$2}' $(MAKEFILE_LIST)

Makefile.inc

@@ -32,7 +32,6 @@ EXAMPLES_DOCKERREPOSITORY = $(REGISTRY)/iinkjs-examples:$(DOCKERTAG)
 CONFIGURATION_DOCKERTAG := master
 MOCHA_DOCKERREPOSITORY = $(REGISTRY)/myscript-webcomponents-mocha:$(CONFIGURATION_DOCKERTAG)
 WAITTCP_DOCKERREPOSITORY = $(REGISTRY)/myscript-webcomponents-wait-tcp:$(CONFIGURATION_DOCKERTAG)
-PUPPETEER_DOCKERREPOSITORY = $(REGISTRY)/myscript-common-puppeteer:1.0.0
 
 BUILDENV := test
 TEST_DOCKER_NAME_PREFIX := iinkjs-$(DOCKERTAG)-$(BUILDENV)-$(BUILDID)
@@ -41,6 +40,9 @@ TEST_DOCKER_EXAMPLES_INSTANCE_NAME := $(TEST_DOCKER_NAME_PREFIX)-examples
 APPLICATIONKEY := 7d223f9e-a3cb-4213-ba4b-85e930605f8b
 HMACKEY := 5ab1935e-529a-4d48-a695-158450e52b13
 
+DEV_APPLICATIONKEY := 515131ab-35fa-411c-bb4d-3917e00faf60
+DEV_HMACKEY := 54b2ca8a-6752-469d-87dd-553bb450e9ad
+
 APIHOST := cloud-internal-master.corp.myscript.com
 APISCHEME := https
 ifeq ($(CDKAPILOCAL),true)

package.json

@@ -42,7 +42,7 @@
     "@rollup/plugin-babel": "^5.0.0",
     "@rollup/plugin-json": "^4.0.2",
     "@rollup/plugin-node-resolve": "^6.1.0",
-    "chai": "^4.2.0",
+    "chai": "^4.3.4",
     "clean-css-cli": "^4.3.0",
     "eslint": "^6.8.0",
     "eslint-config-standard": "^14.1.1",
@@ -51,26 +51,31 @@
     "eslint-plugin-promise": "^4.2.1",
     "eslint-plugin-standard": "^4.0.1",
     "minami": "^1.2.3",
-    "mocha": "^8.1.3",
+    "mocha": "^9.0.3",
     "npm-run-all": "^4.1.5",
+    "playwright": "^1.14.0",
     "postcss-import": "^12.0.1",
-    "puppeteer": "^2.1.1",
     "rollup": "^2.18.0",
     "rollup-plugin-commonjs": "^10.1.0",
     "rollup-plugin-livereload": "^1.2.0",
     "rollup-plugin-postcss": "^2.6.2",
     "rollup-plugin-progress": "^1.1.1",
     "rollup-plugin-serve": "^1.0.1",
     "rollup-plugin-terser": "^7.0.1",
-    "sinon": "^2.4.1"
+    "sinon": "^2.4.1",
+    "taffydb": "^2.7.3"
   },
   "scripts": {
     "lint": "eslint --ext js src",
+    "lint:test": "eslint --ext js test",
     "docs": "npx jsdoc -R README.md -P '' -d docs -t node_modules/minami -r src",
     "minify-css": "cleancss -o dist/iink.min.css src/*.css",
     "test:mocha": "mocha --require @babel/register,./test/lib/common.js --recursive test/mocha/ --reporter progress",
     "test:mocha-xunit": "mocha --require @babel/register --recursive test/mocha/ --reporter xunit --reporter-options output=./test/mocha/results/xunit.xml",
-    "test:e2e": "mocha --require @babel/register,test/puppeteer/base.js --recursive test/puppeteer --timeout 30000 --retries 2 --parallel",
+    "test:e2e": "mocha --config .mocharc.e2e.js",
+    "test:chromium": "BROWSER=chromium mocha --config .mocharc.e2e.js",
+    "test:webkit": "BROWSER=webkit mocha --config .mocharc.e2e.js",
+    "test:firefox": "BROWSER=firefox mocha --config .mocharc.e2e.js",
     "build:js": "rollup -c config/rollup.config.build.js --sourcemap",
     "build": "npm-run-all test:mocha lint build:js minify-css docs",
     "dev:js": "rollup -c config/rollup.config.dev.js -w --sourcemap",

test/.eslintrc.js

@@ -4,6 +4,7 @@ module.exports = {
   },
   globals: {
     browser: true,
+    page: true,
     expect: true
   }
 }