Travis running cypress (gitcoinco#9411)

* updating dependencies to use custom fork of cypress-metamask

* add script and options for running cypress tests

* add wait-on package for scripting cypress runs

* travis docs indicate that bionic will start xvfb by adding it as a service

* add migration step

* another attempt at including cypress tests

* redirect webserver logs to /dev/null

* bad idea to move stdout to dev/null

* add NETWORK_NAME to travis env file

* update runserver command to go to background

* updating existing cypress tests to run on ci

* update docker-compose file: use default accounts for ganache

* add set -x to get more visibility into cypress command args

* update call to cypress run to see if travis will recognize flags

* try running cypress directly from node_modules

* remove set -x now that arguments are making their way to cypress

.travis.yml

@@ -11,6 +11,10 @@ services:
   - docker
   - postgresql
   - redis
+  - xvfb
+
+addons:
+  chrome: stable
 
 cache:
   npm: false
@@ -48,6 +52,9 @@ jobs:
         - npm run stylelint
         - (cd app; python3 ./manage.py collectstatic --noinput --disable-collectfast)
         - pytest -p no:ethereum -p no:warnings
+        # Run cypress tests
+        - export SECRET_WORDS="${SECRET_WORDS}"
+        - bin/ci/cypress-run
         # Generate Markdown documentation and static docs page.
         - pydocmd build
       env:

Dockerfile

@@ -6,7 +6,8 @@ ENV DEBIAN_FRONTEND=noninteractive
 
 ARG PACKAGES="libpq-dev libxml2 libxslt1-dev libfreetype6 libjpeg-dev libmaxminddb-dev bash git tar gzip inkscape libmagic-dev"
 ARG BUILD_DEPS="gcc g++ curl postgresql libxml2-dev libxslt-dev libfreetype6 libffi-dev libjpeg-dev autoconf automake libtool make dos2unix libvips libvips-dev"
-WORKDIR /code
+ARG CHROME_DEPS="fonts-liberation libasound2 libatk-bridge2.0-0 libatk1.0-0 libatspi2.0-0 libcairo2 libcups2 libcurl3-gnutls libdrm2 libexpat1 libgbm1 libglib2.0-0 libnspr4 libgtk-3-0 libpango-1.0-0 libx11-6 libxcb1 libxcomposite1 libxdamage1 libxext6 libxfixes3 libxkbcommon0 libxrandr2 libxshmfence1 xdg-utils"
+ARG CYPRESS_DEPS="libgtk2.0-0 libgbm-dev libnotify-dev libgconf-2-4 libnss3 libxss1 libxtst6 xauth xvfb"
 
 # Inkscape
 RUN apt-get update
@@ -19,13 +20,24 @@ RUN apt-get install -y $PACKAGES
 RUN apt-get update
 RUN apt-get install -y $BUILD_DEPS
 
-RUN apt-get install -y wget
+# Install google chrome for cypress testing
+WORKDIR /usr/src
+RUN apt-get update && apt-get install -y wget
+RUN wget "https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb"
+RUN apt-get install -y $CHROME_DEPS
+RUN dpkg -i google-chrome-stable_current_amd64.deb
+
+# Install cypress dependencies
+RUN apt-get install -y $CYPRESS_DEPS
+
 RUN apt-get install -y libsodium-dev
 
 RUN add-apt-repository universe
 RUN apt-get update
 RUN apt-get install -y python3-pip
 
+WORKDIR /code
+
 COPY dist/* ./
 
 # GeoIP2 Data Files
@@ -58,6 +70,7 @@ RUN apt-get install -y yarn
 RUN yarn global add n
 RUN n stable
 
+EXPOSE 9222
 ENTRYPOINT ["/usr/local/bin/dumb-init", "--"]
 CMD ["bash", "/bin/docker-command.bash"]
 

app/app/travis.env

@@ -8,3 +8,4 @@ GEOIP_PATH=/opt/GeoIP/
 WEB3_HTTP_PROVIDER=https://rinkeby.infura.io/v3/e24d261245fa47d28f0bb4b0dda7a2cb
 INFURA_USE_V3=True
 INFURA_V3_PROJECT_ID=e24d261245fa47d28f0bb4b0dda7a2cb
+NETWORK_NAME=localhost

bin/ci/cypress-run

@@ -0,0 +1,15 @@
+#! /bin/bash
+set -eou pipefail
+
+# start ganache and send to background
+yarn exec ganche-cli -m "${SECRET_WORDS}" -h 0.0.0.0 &
+
+# set up and run web application (sends to background but still writes to stdout)
+python3 app/manage.py migrate
+python3 app/manage.py runserver 0.0.0.0:8000 &
+
+# run cypress tests
+export CYPRESS_REMOTE_DEBUGGING_PORT=9222
+yarn exec cypress install
+yarn exec wait-on http://0.0.0.0:8000
+node_modules/.bin/cypress run --headed -b chrome

bin/docker-command.bash

@@ -55,6 +55,7 @@ then
         then
             yarn run build
         else
+            yarn cypress install
             yarn run webpack &
         fi
     fi

cypress/integration/test_visit.js

@@ -16,26 +16,12 @@ describe('Visit Tests', function() {
   it('Visits the Kudos Marketplace', function() {
     cy.visit('http://localhost:8000/kudos/marketplace');
   });
-  /*
-  it('Visits the Kudos Sender', function() {
-    cy.visit('http://localhost:8000/kudos/send');
-    cy.url().should('contain', 'github.com');
-  });
-  */
   it('Visits the Labs Page', function() {
     cy.visit('http://localhost:8000/explorer');
   });
-  it('Visits the About Page', function() {
-    cy.visit('http://localhost:8000/about');
-  });
   it('Visits the Mission Page', function() {
     cy.visit('http://localhost:8000/mission');
   });
-  /*
-  it('Visits the Results Page', function() {
-    cy.visit('http://localhost:8000/results');
-  });
-  */
   it('Visits the Activity Page', function() {
     cy.visit('http://localhost:8000/activity');
   });

docker-compose.yml

@@ -45,6 +45,8 @@ services:
 
   web:
     restart: unless-stopped
+    ipc: host
+    shm_size: '4gb'
     environment:
       - PYTHONUNBUFFERED=1
       - PYTHONIOENCODING=utf8
@@ -63,6 +65,7 @@ services:
       - "3030:3030"
       - "8001:8001"
       - "35729:35729"
+      - "9222:9222"
     depends_on:
       - db
     stdin_open: true
@@ -79,7 +82,7 @@ services:
     image: trufflesuite/ganache-cli
     ports:
       - "8545:8545"
-    command: '-a 1 --seed 2 --host 0.0.0.0 --mnemonic "${TEST_MNEMONIC}"'
+    command: '--host 0.0.0.0 --mnemonic "${TEST_MNEMONIC}"'
     deploy:
       replicas: 1
       resources:

package.json

@@ -38,6 +38,7 @@
     "stylelint-config-recommended": "^2.2.0",
     "stylelint-scss": "^3.19.0",
     "uglify-js": "^3.13.4",
+    "wait-on": "^6.0.0",
     "webpack": "^5.36.0",
     "webpack-cli": "^4.6.0",
     "webpack-watched-glob-entries-plugin": "^2.1.9"
@@ -47,6 +48,7 @@
     "@joeattardi/emoji-button": "^3.1.1",
     "bootstrap": "4.6.0",
     "bootstrap-vue": "2.18.0",
+    "cypress-metamask": "github:gitcoinco/cypress-metamask",
     "daterangepicker": "3.0.5",
     "dompurify": "^2.2.9",
     "gsap": "3.6.0",