Skip to main content

Posts

Showing posts from 2020

Cypress UI Automation - part 4

  Visual Testing Cypress does not check on CSS changes on elements, instead, I used Visual Testing Tool to achieve this. I integrated Percy Visual Testing in the Cypress automation as follows: Firstly, I created a Jira ticket for visual testing. Then I pulled the develop , our main branch from GitHub using Visual Studio Code IDE, and created a new local git branch, this would ensure I have the latest merged code to begin the test. I run the npm command - npm install --save-dev @percy/cypress To install Percy. Then imported - import '@percy/cypress'; in support/commands.js which will give us access to the Percy snapshot command- cy.percySnapshot(). Also, percy expects a PERCY_TOKEN to be set, this value can be found on the Percy project in the BrowserStack dashboard.  Set PERCY_TOKEN=<PERCY_TOKEN VALUE> I logged into the Browserstack online dashboard and created a project then copied the PERCY_TOKEN value provided. Using the following command, I i...

Cypress UI Automation - part 3

  Cross Browser Testing BrowserStack implementation I created a local git branch using Visual studio code, then installed BrowserStack as follows: Firstly install it on the command line : npm install -g BrowserStack-cypress-cli --save-dev Setup the BrowserStack credentials to use by initiating the browserstack.json file as follows: BrowserStack-cypress init If this does not work, right-click the cypress folder, create a new file as BrowserStack-cypress.json. I executed the following command. npm run test:first. To run the BrowserStack tests. Below is a screenshot of the browserstack.json file. Code in the package.json file to execute the BrowserStack tests: In the change, I have edited the baseUrl with the –env env=stg, pointing it to the environment file which contains details of the test environment that loads the test pages/websites. Then I specified details of a test spec file. I executed the test command resulting in a successful execution – Errors after ...

Cypress UI Automation - part 2

  Accessibility Testing  Accessibility Testing Jira Ticket The above ticket covers the need for the product team to implement Accessibility on the product. It shows the WCAG 2 level (A, AA, AAA) and the government requirements of AA and Accessibility. I understood that the accessibility level on the e-commerce products needed to be in level with the government’s target of AA accessibility level. I was expected to check that our level of Accessibility was in line with the government’s target level of AA on E-commerce products.  As part of the Automation test Strategy document, testers were required to implement Accessibility testing on their product, and part of the instruction was to create a ticket for each requirement. On this ticket, I have added some details of the test approach. I wanted to learn more about the accessibility tools and test results so the approach here was to start with the WAVE and axe tools of the Developers tools on the chrome browsers. I then deve...