From 75493ee557f4c680295cff2504cdf3b63280f01a Mon Sep 17 00:00:00 2001 From: Megha Sachdev Date: Tue, 21 May 2019 14:02:27 -0700 Subject: [PATCH] Introducing Applitools (#762) * Applitools (#1) * Adding applitools * adding data attributes for testing * add applitools key --- .travis.yml | 6 +- components/BackgroundSelect.js | 1 + components/Button.js | 10 +- components/Dropdown.js | 3 +- components/ExportMenu.js | 1 + components/Themes/index.js | 2 +- .../visual-testing/button-test.spec.js | 48 + .../visual-testing/syntax-test.spec.js | 40 + .../visual-testing/theme-test.spec.js | 28 + cypress/plugins/index.js | 2 + cypress/support/index.js | 4 +- cypress/util.js | 1 + package.json | 1 + yarn.lock | 3087 ++++++++++++----- 14 files changed, 2437 insertions(+), 797 deletions(-) create mode 100644 cypress/integration/visual-testing/button-test.spec.js create mode 100644 cypress/integration/visual-testing/syntax-test.spec.js create mode 100644 cypress/integration/visual-testing/theme-test.spec.js create mode 100644 cypress/util.js diff --git a/.travis.yml b/.travis.yml index 79f9489..f051f59 100644 --- a/.travis.yml +++ b/.travis.yml @@ -4,16 +4,18 @@ node_js: addons: apt: packages: - # Ubuntu 16+ does not install this dependency by default, so we need to install it ourselves - libgconf-2-4 cache: yarn: true directories: - node_modules - - ~/.cache + - '~/.cache' install: - yarn script: - yarn lint - yarn build - yarn start & wait-on http://localhost:3000 && CYPRESS_CI=true yarn cy:run --config baseUrl=http://localhost:3000 +env: + global: + secure: vDOtuvz5TE9CWh5Sotj936YaFQtIF2u8ZKKqokWqozO1RSbZ+FOwE1t31a5MxsKIsH1BSzGDEIkOJ32qFn+M8MWu848sqNzxsfC4gAx+66dE/or0DCv+42gncpqzXSDe8FziOPcW5SutVZhK/4X5T7WIeo7DTld5UuWyWkMztnCPL9WzYfM+jDHpi+F/CyPSqpGGWsXpq57i8IOvSzPosKlk/8pKnm7T5vWlqb4NTvR/nfZuPqfH1fQJbhuZLyXiEpXEGHz3zuSmoKgx7/HZKpaRsRssSrpYTeE63Bw/o+CSV+a81xFXTptu+sa4S1hcHKs3uxwudS/ym4p0cheTkBHzB/Rqljw9Wf2Qq+KL9Z3i+bA0lS+iMZTAABRZ8TGptdlfSRZcjsPEbznRGOPFdyUag+q/xOiAY1+ch/cztI8VR1RGpx3LeUWtn6szkfVEpJeT/sqeTgpp9SvND+O8gUCBnAsndNghedAVl7GHUTkSVlIUPHLD9Esl/V7C/9ItZ9fkQU0msIqx/kxICzwk+QW6q4hLZje9KCt9JqGC09+4GyIbei+jWDwNEbus19OW+D90m4vAub0H7FTQCgH7ZbKysl2yYantAjCxr0m19StGuUbyMIaJaub9ClkHLdk4dxdetY6S0Wlsv8Yw1CVV20NASwYSt0N0x8uPCI0MvsQ= diff --git a/components/BackgroundSelect.js b/components/BackgroundSelect.js index ac3fac0..9ed07fd 100644 --- a/components/BackgroundSelect.js +++ b/components/BackgroundSelect.js @@ -41,6 +41,7 @@ class BackgroundSelect extends React.PureComponent { onClick={toggleVisibility} background="white" hoverBackground="white" + data-cy="display" >
diff --git a/components/Button.js b/components/Button.js index 898c2fc..e843596 100644 --- a/components/Button.js +++ b/components/Button.js @@ -5,6 +5,7 @@ import { COLORS } from '../lib/constants' const Button = ({ id, + 'data-cy': cypressElementId, onClick = () => {}, className = '', background = COLORS.BLACK, @@ -23,7 +24,14 @@ const Button = ({ margin = 0, title }) => ( -