Skip to content

Commit

Permalink
tests(#57): fix Jest configuration and tests
Browse files Browse the repository at this point in the history
  • Loading branch information
damien-carcel committed Nov 12, 2023
1 parent 2550f58 commit cb047e3
Show file tree
Hide file tree
Showing 11 changed files with 198 additions and 183 deletions.
14 changes: 7 additions & 7 deletions .circleci/config.yml
Original file line number Diff line number Diff line change
Expand Up @@ -45,30 +45,30 @@ jobs:
- ./.next/cache
- run:
name: Check the code style
command: task tests:check-code-style
command: task tests:static:prettier:check
- run:
name: Lint the stylesheets
command: task tests:lint-css
command: task tests:static:css:lint
- run:
name: Lint the application code
command: task tests:lint-ts -- --format junit -o test_results/eslint.xml
command: task tests:static:ts:lint -- --format junit -o test_results/eslint.xml
- run:
name: Check the code typing
command: task tests:check-types
command: task tests:static:types:check
- run:
name: Run unit tests
environment:
JEST_JUNIT_OUTPUT_DIR: test_results
JEST_JUNIT_OUTPUT_NAME: unit.xml
command: task tests:unit-tests -- --reporters=default --reporters=jest-junit
command: task tests:unit:run -- --reporters=default --reporters=jest-junit
- run:
name: Run component tests
command: task tests:component-tests-headless
command: task tests:component:headless
- run:
name: Run end-to-end tests
command: |
task run:database
task run:migrate
task tests:e2e-tests-headless
task tests:e2e:headless
- store_test_results:
path: test_results
5 changes: 4 additions & 1 deletion TODO.md
Original file line number Diff line number Diff line change
@@ -1 +1,4 @@
- Run the tasks directly in Dev Containers like before
- Configure Jest to be able to write tests in TypeScript
- Make Cypress tests run
- Make Cypress work with both Xorg and Wayland
- Run the tasks directly in Dev Containers like before?
132 changes: 25 additions & 107 deletions __tests__/__snapshots__/snapshot.js.snap
Original file line number Diff line number Diff line change
@@ -1,121 +1,39 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`renders homepage unchanged 1`] = `
exports[`renders homepage 1`] = `
<div>
<div
class="container"
class="main"
>
<main
class="main"
<div
class="intro"
>
<h1
class="title"
>
Welcome to
<a
href="https://nextjs.org"
>
Next.js!
</a>
</h1>
<p
class="description"
<div
class="hello"
>
Get started by editing
<code
class="code"
>
pages/index.js
</code>
</p>
Hello, I'm Damien Carcel.
</div>
<div
class="grid"
class="about"
>
<a
class="card"
href="/about"
>
<h2>
About Page →
</h2>
<p>
Cypress will test if this link is working.
</p>
</a>
<a
class="card"
href="https://nextjs.org/docs"
>
<h2>
Documentation →
</h2>
<p>
Find in-depth information about Next.js features and API.
</p>
</a>
<a
class="card"
href="https://nextjs.org/learn"
>
<h2>
Learn →
</h2>
<p>
Learn about Next.js in an interactive course with quizzes!
</p>
</a>
<a
class="card"
href="https://github.com/vercel/next.js/tree/canary/examples"
>
<h2>
Examples →
</h2>
<p>
Discover and deploy boilerplate example Next.js projects.
</p>
</a>
<a
class="card"
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
rel="noopener noreferrer"
target="_blank"
>
<h2>
Deploy →
</h2>
<p>
Instantly deploy your Next.js site to a public URL with Vercel.
</p>
</a>
I like to craft software.
</div>
</main>
<footer
class="footer"
</div>
<div
class="photo"
>
<a
href="https://vercel.com?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
rel="noopener noreferrer"
target="_blank"
>
Powered by
<span
class="logo"
>
<img
alt="Vercel Logo"
data-nimg="1"
decoding="async"
height="16"
loading="lazy"
src="/vercel.svg"
style="color: transparent;"
width="72"
/>
</span>
</a>
</footer>
<img
alt="me.jpg"
data-nimg="1"
decoding="async"
height="320"
loading="lazy"
src="/_next/image?url=%2Fme.jpg&w=640&q=75"
srcset="/_next/image?url=%2Fme.jpg&w=384&q=75 1x, /_next/image?url=%2Fme.jpg&w=640&q=75 2x"
style="color: transparent;"
width="320"
/>
</div>
</div>
</div>
`;
5 changes: 3 additions & 2 deletions __tests__/snapshot.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import { render } from '@testing-library/react';
import Home from '../pages/index';

it('renders homepage unchanged', () => {
import Home from '@/app/page';

it('renders homepage', () => {
const { container } = render(<Home />);
expect(container).toMatchSnapshot();
});
4 changes: 2 additions & 2 deletions compose.yaml
Original file line number Diff line number Diff line change
Expand Up @@ -50,13 +50,13 @@ services:
environment:
<<: *cache-env-variables
CYPRESS_RECORD_KEY: ${CYPRESS_RECORD_KEY-:to_be_replaced_with_a_real_key}
DISPLAY: ${DISPLAY}
# DISPLAY: ${DISPLAY}
user: 1000:1000
volumes:
- .:/srv/app
- ${HOST_CYPRESS_CACHE_FOLDER:-~/.cache/Cypress}:/home/cypress-cache
- ${HOST_YARN_CACHE_FOLDER:-~/.cache/yarn}:/home/yarn-cache
- ${HOST_YARN_CONFIG_FOLDER:-~/.yarn}:/.yarn
- ${HOST_YARN_CONFIG_FILE:-~/.yarnrc}:/.yarnrc
- /tmp/.X11-unix:/tmp/.X11-unix
# - /tmp/.X11-unix:/tmp/.X11-unix
working_dir: /srv/app
8 changes: 4 additions & 4 deletions jest.config.mjs → jest.config.ts
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
import nextJest from 'next/jest.js'
import nextJest from 'next/jest.js';

const createJestConfig = nextJest({
dir: './',
})
});

/** @type {import('jest').Config} */
const config = {
testEnvironment: 'jest-environment-jsdom',
}
};

export default createJestConfig(config)
export default createJestConfig(config);
1 change: 1 addition & 0 deletions jest.setup.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
import '@testing-library/jest-dom';
24 changes: 13 additions & 11 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,19 +1,20 @@
{
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"dev": "next dev",
"start": "next start",
"e2e": "start-server-and-test dev http://localhost:3000 \"cypress open --e2e\"",
"e2e:headless": "start-server-and-test dev http://localhost:3000 \"cypress run --e2e --record\"",
"component": "cypress open --component",
"component:headless": "cypress run --component --record",
"unit:watch": "jest --watch",
"unit:ci": "jest --ci",
"lint:js": "next lint",
"lint:css": "stylelint '**/*.css'",
"prettier": "prettier '**/*.{ts,tsx}'",
"typecheck": "tsc -b"
"tests:component": "cypress open --component",
"tests:component:headless": "cypress run --component --record",
"tests:e2e": "start-server-and-test dev http://localhost:3000 \"cypress open --e2e\"",
"tests:e2e:headless": "start-server-and-test dev http://localhost:3000 \"cypress run --e2e --record\"",
"tests:lint:css": "stylelint '**/*.css'",
"tests:lint:js": "next lint",
"tests:prettier": "prettier '**/*.{ts,tsx}'",
"tests:typecheck": "tsc -b",
"tests:unit:ci": "jest --ci",
"tests:unit:update-snapshots": "jest --jest --updateSnapshot",
"tests:unit:watch": "jest --watch"
},
"engines": {
"node": ">=18.0.0 <19.0.0"
Expand Down Expand Up @@ -41,6 +42,7 @@
"stylelint": "^15.10.1",
"stylelint-config-prettier": "^9.0.5",
"stylelint-config-standard": "^34.0.0",
"ts-node": "^10.9.1",
"typescript": "^5.1.6"
}
}
Loading

0 comments on commit cb047e3

Please sign in to comment.