Skip to content

Commit

Permalink
GOTH-576 Set up cypress tests (#257)
Browse files Browse the repository at this point in the history
* install cypress
* add tests and fixtures
* integrate into circle ci workflow
* add a script to update fixtures
* update readme
  • Loading branch information
walsh9 authored Mar 21, 2023
1 parent e79018a commit 3564bd2
Show file tree
Hide file tree
Showing 40 changed files with 20,535 additions and 736 deletions.
62 changes: 45 additions & 17 deletions .circleci/config.yml
Original file line number Diff line number Diff line change
Expand Up @@ -27,11 +27,15 @@ workflows:
- build:
<<: *filter_all
- test_nginx:
<<: *filter_all
<<: *filter_all
- test:
<<: *filter_all
requires:
- build
- test_cypress:
<<: *filter_all
requires:
- build
- deploy:
name: Deploy (demo)
context: "AWS Deploy"
Expand All @@ -40,6 +44,7 @@ workflows:
requires:
- test
- test_nginx
- test_cypress
- deploy:
name: Deploy (prod)
context: "AWS Deploy"
Expand All @@ -48,33 +53,56 @@ workflows:
requires:
- test
- test_nginx
- test_cypress

jobs:
# Note (allie): This is its own job because I don't
jobs:
# Note (allie): This is its own job because I don't
# want to run the tests in an environment that has the
# built project.
# built project.
build:
executor: default
steps:
- checkout
- setup_npmrc
- run:
name: Assert that it builds
- run:
name: install dependencies
command: |
npm ci
- save_cache:
key: v3-deps-{{ checksum "package-lock.json" }}
paths:
- node_modules
- /root/.cache/Cypress
- run:
name: Assert that it builds
command: |
npm run build
test:
executor: default
steps:
- checkout
- setup_npmrc
- restore_cache:
key: v3-deps-{{ checksum "package-lock.json" }}
# run test suite
- run:
name: Run unit tests
command: |
npm ci
npx nuxi prepare
npm run test
npm run test
test_cypress:
executor: default
steps:
- checkout
- restore_cache:
key: v3-deps-{{ checksum "package-lock.json" }}
# run test suite
- run:
name: Run unit tests
command: |
npx nuxi prepare
npm run test-cypress-ci
test_nginx:
docker:
Expand All @@ -96,12 +124,12 @@ jobs:
command: |
apt-get update && \
apt-get install -y nginx-extras
mkdir -p /app/nginx
mkdir -p /app/nginx
cp ./nginx/*.conf /etc/nginx/
nginx -t
deploy:
docker:
docker:
- image: circleci/python:3.8
parameters:
env:
Expand All @@ -115,7 +143,7 @@ jobs:
- checkout
- setup_npmrc
- setup_remote_docker:
version: 20.10.12
version: 20.10.12
- run:
name: Deploy
environment:
Expand All @@ -128,7 +156,7 @@ jobs:
python3 -m venv ~/.venv
source ~/.venv/bin/activate
pip3 install -U git+https://github.com/nypublicradio/nyprsetuptools.git
nyprsetuptools DockerDeploy \
--fargate \
--cpu=2048 \
Expand All @@ -140,7 +168,7 @@ jobs:
--task-role=$ROLE \
--environment=$ENV \
--tag=$TAG \
--wait=300
--wait=300
commands:
setup_npmrc:
Expand All @@ -150,10 +178,10 @@ commands:
command: |
echo "@nypublicradio:registry=https://npm.pkg.github.com" > .npmrc
echo "//npm.pkg.github.com/:_authToken=$PAT" >> .npmrc
executors:
default:
docker:
- image: cimg/node:16.14.2
environment:
- image: cypress/browsers:node-16.18.1-chrome-110.0.5481.96-1-ff-109.0-edge-110.0.1587.41-1
environment:
JOBS: 2
4 changes: 3 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -6,4 +6,6 @@ nuxt.d.ts
.env
coverage
.vscode
.npmrc
.npmrc
cypress/videos/
cypress/screenshots/
2 changes: 1 addition & 1 deletion components/SectionPageTemplate.vue
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ const newsletterSubmitEvent = () => {
<HtlAd layout="rectangle" slot="htlad-gothamist_interior_midpage_1" />
</div>
<!-- articles -->
<div id="articleList" v-if="articles" class="grid gutter-x-xl">
<div id="articleList" v-if="articles" class="grid gutter-x-xl section-river">
<h2 class="sr-only">Latest {{ page.title }} Articles</h2>
<div class="col-1 hidden xl:block"></div>
<div class="col">
Expand Down
7 changes: 7 additions & 0 deletions cypress.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { defineConfig } from "cypress";

export default defineConfig({
e2e: {
baseUrl: 'http://localhost:3000'
},
});
54 changes: 54 additions & 0 deletions cypress/e2e/article.cy.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
describe('An article page', () => {
beforeEach(() => {
cy.loadGlobalFixtures()
cy.intercept({
pathname: '/api/v2/pages/find',
query: {
html_path: 'news/extra-extra-meet-connecticuts-answer-to-pizza-rat'
}
}, {fixture: 'aviary/article.json'}).as('article')
cy.intercept({
pathname: '/api/v2/pages/find',
query: {
html_path: 'news'
}
}, {fixture: 'aviary/news-page.json'}).as('newsPage')
cy.intercept({
pathname: '/api/v2/pages',
query: {
type: 'news.ArticlePage',
fields: 'ancestry,description,lead_asset,legacy_id,listing_image,publication_date,show_as_feature,sponsored_content,tags,updated_date,url,uuid,listing_title,listing_summary,related_authors',
order: '-publication_date',
show_on_index_listing: 'true',
sponsored_content: 'false',
descendant_of: '4',
limit: '6'
}
}, {fixture: 'aviary/more-news.json'}).as('moreNews')
})
it('successfully loads', () => {
cy.visit('/news/extra-extra-meet-connecticuts-answer-to-pizza-rat')
cy.wait('@article')

cy.get('h1').should('exist')
cy.get('.byline').should('exist')
cy.get('.article-body').should('exist')
cy.get('.tags').should('exist')
cy.get('.author-profile').should('exist')
cy.get('.recirculation').should('exist')
cy.get('.recirculation .gothamist-card:not(.hidden)').should('have.length', 5)
})
it('shows the marketing CTAs', () => {
cy.intercept(
'/api/v2/system_messages/*',
{fixture: 'aviary/system_messages_bottom.json'}
).as('systemMessagesWithBottomCTA')

cy.visit('/news/extra-extra-meet-connecticuts-answer-to-pizza-rat')
cy.get('.marketing-modal').should('exist')
cy.get('.p-dialog-header-close').click()
cy.get('.marketing-modal').should('not.exist')
cy.get('.article-donation-marketing-CTA').should('exist')
cy.get('.article-donation-marketing-bottom-CTA').should('exist')
})
})
61 changes: 61 additions & 0 deletions cypress/e2e/index.cy.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
describe('The home page', () => {
beforeEach(() => {
cy.loadGlobalFixtures()
cy.intercept({
pathname :'/api/v2/pages/',
query: {
type: 'news.ArticlePage',
fields: 'ancestry,description,lead_asset,legacy_id,listing_image,publication_date,show_as_feature,sponsored_content,tags,updated_date,url,uuid,listing_title,listing_summary,related_authors',
order: '-publication_date',
show_on_index_listing: 'true',
limit: '6'
}
}, {fixture: 'aviary/latest.json'}).as('latest')
cy.intercept({
pathname :'/api/v2/pages/',
query: {
type: 'news.ArticlePage',
fields: 'ancestry,description,lead_asset,legacy_id,listing_image,publication_date,show_as_feature,sponsored_content,tags,updated_date,url,uuid,listing_title,listing_summary,related_authors',
order: '-publication_date',
show_on_index_listing: 'true',
limit: '6',
offset: '6'
}
}, {fixture: 'aviary/index-more.json'}).as('indexMore')
cy.intercept({
pathname: '/api/v2/pages/find',
query: { html_path: '/' },
}, {fixture: 'aviary/index.json'}).as('index')
})
it('successfully loads', () => {
cy.visit('/')
cy.wait(['@index','@latest'])
cy.get('.homepage-topper').should('exist')
cy.get('.homepage-topper .gothamist-card').should('have.length', 5)
cy.get('.newsletter-home').should('exist')
cy.get('.center-feature').should('exist')
cy.get('.center-feature .gothamist-card:not(.hidden)').should('have.length', 6)
cy.get('.boroughs').should('exist')
cy.get('#articleList').should('exist')
cy.get('#articleList .gothamist-card').should('have.length', 6)
})
it('loads more', () => {
cy.visit('/')
cy.wait('@latest')
cy.contains('Load More').click()
cy.wait('@indexMore')
cy.get('#articleList .gothamist-card').should('have.length', 12)
cy.get('#articleList .card-title-link').eq(6).should('have.focus')
})
it('shows the marketing modal', () => {
cy.intercept(
'/api/v2/system_messages/*',
{fixture: 'aviary/system_messages_bottom.json'}
).as('systemMessagesWithBottomCTA')

cy.visit('/')
cy.get('.marketing-modal').should('exist')
cy.get('.p-dialog-header-close').click()
cy.get('.marketing-modal').should('not.exist')
})
})
64 changes: 64 additions & 0 deletions cypress/e2e/sectionpage.cy.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
describe('A section page', () => {
beforeEach(() => {
cy.loadGlobalFixtures()
cy.intercept({
pathname: '/api/v2/pages/find',
query: {
html_path: 'news'
}
}, {fixture: 'aviary/section-page.json'}).as('sectionPage')
cy.intercept({
pathname: '/api/v2/pages',
query: {
type: 'news.ArticlePage',
fields: 'ancestry,description,lead_asset,legacy_id,listing_image,publication_date,show_as_feature,sponsored_content,tags,updated_date,url,uuid,listing_title,listing_summary,related_authors',
order: '-publication_date',
show_on_index_listing: 'true',
sponsored_content: 'false',
descendant_of: '4',
limit: '6'
}
}, {fixture: 'aviary/section-recirculation.json'}).as('sectionRecirculation')
cy.intercept({
pathname: '/api/v2/pages',
query: {
type: 'news.ArticlePage',
fields: 'ancestry,description,lead_asset,legacy_id,listing_image,publication_date,show_as_feature,sponsored_content,tags,updated_date,url,uuid,listing_title,listing_summary,related_authors',
order: '-publication_date',
show_on_index_listing: 'true',
sponsored_content: 'false',
descendant_of: '4',
offset: '5'
}
}, {fixture: 'aviary/section-articles.json'}).as('sectionArticles')
cy.intercept({
pathname: '/api/v2/pages',
query: {
type: 'news.ArticlePage',
fields: 'ancestry,description,lead_asset,legacy_id,listing_image,publication_date,show_as_feature,sponsored_content,tags,updated_date,url,uuid,listing_title,listing_summary,related_authors',
order: '-publication_date',
show_on_index_listing: 'true',
sponsored_content: 'false',
descendant_of: '4',
limit: '10',
offset: '25'
}
}, {fixture: 'aviary/section-more.json'}).as('sectionMore')
})
it('successfully loads', () => {
cy.visit('/news')
cy.wait('@sectionArticles')
cy.get('#article-recirculation').should('exist')
cy.get('#article-recirculation .gothamist-card:not(.hidden)').should('have.length', 5)
cy.get('#articleList').should('exist')
cy.get('#articleList .gothamist-card').should('have.length', 20)
})
it('loads more', () => {
cy.visit('/news')
cy.wait('@sectionArticles')
cy.contains('Load More').click()
cy.wait('@sectionMore')
cy.get('#articleList .gothamist-card').should('have.length', 30)
cy.get('#articleList .card-title-link').eq(20).should('have.focus')
})
})
41 changes: 41 additions & 0 deletions cypress/e2e/staffpage.cy.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
describe('A staff page', () => {
beforeEach(() => {
cy.loadGlobalFixtures()
cy.intercept({
pathname: '/api/v2/pages',
query: {
type: 'news.ArticlePage',
fields: 'ancestry,description,lead_asset,legacy_id,listing_image,publication_date,show_as_feature,sponsored_content,tags,updated_date,url,uuid,listing_title,listing_summary,related_authors',
order: '-publication_date',
show_on_index_listing: 'true',
author_slug: 'jen-chung',
limit: '12',
offset: '0'
}
}, {fixture: 'aviary/staff-articles.json'}).as('staffArticles')

cy.intercept({
pathname: '/api/v2/pages',
query: {
type: 'news.ArticlePage',
fields: 'ancestry,description,lead_asset,legacy_id,listing_image,publication_date,show_as_feature,sponsored_content,tags,updated_date,url,uuid,listing_title,listing_summary,related_authors',
order: '-publication_date',
show_on_index_listing: 'true',
author_slug: 'jen-chung',
limit: '12',
offset: '12'
}
}, {fixture: 'aviary/staff-more.json'}).as('staffMore')
})
it('successfully loads', () => {
cy.visit('/staff/jen-chung')
cy.get('#articleList .gothamist-card').should('have.length', 12)
})
it('loads more', () => {
cy.visit('/staff/jen-chung')
cy.contains('Load More').click()
cy.wait('@staffMore')
cy.get('#articleList .gothamist-card').should('have.length', 24)
cy.get('#articleList .card-title-link').eq(12).should('have.focus')
})
})
Loading

0 comments on commit 3564bd2

Please sign in to comment.