Skip to content

Commit 5569902

Browse files
ythecombinatorythecombinator
committed
Initial commit from Create Next App
0 parents  commit 5569902

36 files changed

+696
-0
lines changed

‎.babelrc

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"presets": ["next/babel"]
3+
}

‎.eslintrc.json

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": "next/core-web-vitals"
3+
}

‎.github/dependabot.yml

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
version: 2
2+
updates:
3+
- package-ecosystem: npm
4+
directory: '/'
5+
schedule:
6+
interval: 'weekly'
7+
day: 'saturday'
8+
time: '11:00'
9+
open-pull-requests-limit: 12
10+
assignees:
11+
- freddydumont

‎.github/workflows/auto-merge.yml

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
name: Merge dependabot PRs
2+
3+
on:
4+
workflow_run:
5+
types:
6+
- completed
7+
workflows:
8+
- 'Test with Jest and Cypress'
9+
10+
jobs:
11+
merge-me:
12+
name: Merge me!
13+
14+
runs-on: ubuntu-latest
15+
16+
steps:
17+
- name: Merge me!
18+
if: ${{ github.event.workflow_run.conclusion == 'success' }}
19+
uses: ridedott/merge-me-action@v2
20+
with:
21+
# Depending on branch prodtection rules, a manually populated
22+
# `GITHUB_TOKEN_WORKAROUND` secret with permissions to push to
23+
# a protected branch must be used.
24+
#
25+
# When using a custom token, it is recommended to leave the following
26+
# comment for other developers to be aware of the reasoning behind it:
27+
#
28+
# This must be used as GitHub Actions token does not support pushing
29+
# to protected branches.
30+
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
31+
PRESET: DEPENDABOT_MINOR
32+
MERGE_METHOD: REBASE

‎.github/workflows/main.yml

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
name: Test with Jest and Cypress
2+
on: [push]
3+
jobs:
4+
yarn-test:
5+
runs-on: ubuntu-latest
6+
steps:
7+
- uses: actions/checkout@v2
8+
- name: Install modules
9+
run: yarn --frozen-lockfile
10+
- name: Run tests
11+
run: yarn test
12+
13+
cypress-run:
14+
runs-on: ubuntu-latest
15+
steps:
16+
- name: Checkout
17+
uses: actions/checkout@v2
18+
19+
- name: Cypress run
20+
uses: cypress-io/github-action@v2
21+
with:
22+
build: yarn run build
23+
start: yarn start
24+
wait-on: 'http://localhost:3000'
25+
26+
- name: Upload artifacts
27+
uses: actions/upload-artifact@v2
28+
if: failure()
29+
with:
30+
name: artifacts-${{ github.run_id }}
31+
path: |
32+
${{ github.workspace }}/cypress/screenshots
33+
${{ github.workspace }}/cypress/videos

‎.gitignore

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
/cypress/screenshots
11+
/cypress/videos
12+
13+
# next.js
14+
/.next/
15+
/out/
16+
17+
# production
18+
/build
19+
20+
# misc
21+
.DS_Store
22+
.env*
23+
24+
# debug
25+
npm-debug.log*
26+
yarn-debug.log*
27+
yarn-error.log*

‎.husky/.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
_

‎.husky/pre-commit

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
#!/bin/sh
2+
. "$(dirname "$0")/_/husky.sh"
3+
4+
yarn lint-staged

‎.husky/pre-push

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
#!/bin/sh
2+
. "$(dirname "$0")/_/husky.sh"
3+
4+
yarn run typecheck
5+
yarn test

‎.prettierrc

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"printWidth": 80,
3+
"semi": true,
4+
"singleQuote": true,
5+
"trailingComma": "es5",
6+
"arrowParens": "always"
7+
}

‎LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) 2021 freddydumont
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

‎README.md

+39
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
# Next.js Front End starter pack
2+
3+
Based on [`next-theme-ui-example`](https://github.com/system-ui/theme-ui/tree/master/examples/next).
4+
5+
Featuring:
6+
7+
- TypeScript
8+
- Next.js
9+
- ThemeUI
10+
- NProgress
11+
- Jest
12+
- Cypress
13+
- react-testing-library
14+
15+
## Testing
16+
17+
Jest is configured and ready to use with `react-testing-library`.
18+
19+
There is a custom rendering setup similar to what is found in [the documentation](https://testing-library.com/docs/react-testing-library/setup#custom-render). It wraps all tested components with ThemeUI's `ThemeProvider`.
20+
21+
The custom test renderer, and all `react-testing-library` exports are available without using relative imports:
22+
23+
```javascript
24+
import { render, fireEvent } from 'test-utils';
25+
```
26+
27+
Make sure you import from `'test-utils'` or your tests may crash if the theme is expected.
28+
29+
### Emotion snapshots
30+
31+
Because ThemeUI uses emotion under the hood, `@emotion/jest`'s [snapshot serializer](https://emotion.sh/docs/testing) is included.
32+
33+
Refer to the emotion's [testing documentation](https://emotion.sh/docs/testing) for more info.
34+
35+
### End-to-End tests with Cypress
36+
37+
See [the example test](https://github.com/freddydumont/theme-ui-next-boilerplate/blob/master/cypress/integration/navigation_spec.ts) and Cypress's documentation to get started.
38+
39+
By default the tests are running in CI with GitHub actions.

‎cypress.json

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{}

‎cypress/fixtures/example.json

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"name": "Using fixtures to represent data",
3+
"email": "[email protected]",
4+
"body": "Fixtures are a great way to mock data for responses to routes"
5+
}

‎cypress/integration/navigation.spec.ts

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
describe('Rendering and navigation', () => {
2+
it('should navigate between pages without crashing', () => {
3+
cy.visit('http://localhost:3000');
4+
cy.findAllByText(/hello/i).should('exist');
5+
cy.findAllByText(/style guide/i).click();
6+
cy.findAllByText(/color palette/i).should('exist');
7+
cy.findAllByText(/home/i).click();
8+
cy.findAllByText(/hello/i).should('exist');
9+
});
10+
});

‎cypress/plugins/index.js

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
/// <reference types="cypress" />
2+
// ***********************************************************
3+
// This example plugins/index.js can be used to load plugins
4+
//
5+
// You can change the location of this file or turn off loading
6+
// the plugins file with the 'pluginsFile' configuration option.
7+
//
8+
// You can read more here:
9+
// https://on.cypress.io/plugins-guide
10+
// ***********************************************************
11+
12+
// This function is called when a project is opened or re-opened (e.g. due to
13+
// the project's config changing)
14+
15+
/**
16+
* @type {Cypress.PluginConfig}
17+
*/
18+
module.exports = (/*on, config*/) => {
19+
// `on` is used to hook into various events Cypress emits
20+
// `config` is the resolved Cypress config
21+
};

‎cypress/support/commands.js

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
// ***********************************************
2+
// This example commands.js shows you how to
3+
// create various custom commands and overwrite
4+
// existing commands.
5+
//
6+
// For more comprehensive examples of custom
7+
// commands please read more here:
8+
// https://on.cypress.io/custom-commands
9+
// ***********************************************
10+
//
11+
//
12+
// -- This is a parent command --
13+
// Cypress.Commands.add("login", (email, password) => { ... })
14+
//
15+
//
16+
// -- This is a child command --
17+
// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
18+
//
19+
//
20+
// -- This is a dual command --
21+
// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
22+
//
23+
//
24+
// -- This will overwrite an existing command --
25+
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })
26+
import '@testing-library/cypress/add-commands';

‎cypress/support/index.js

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
// ***********************************************************
2+
// This example support/index.js is processed and
3+
// loaded automatically before your test files.
4+
//
5+
// This is a great place to put global configuration and
6+
// behavior that modifies Cypress.
7+
//
8+
// You can change the location of this file or turn off
9+
// automatically serving support files with the
10+
// 'supportFile' configuration option.
11+
//
12+
// You can read more here:
13+
// https://on.cypress.io/configuration
14+
// ***********************************************************
15+
16+
// Import commands.js using ES2015 syntax:
17+
import './commands';
18+
19+
// Alternatively you can use CommonJS syntax:
20+
// require('./commands')

‎cypress/tsconfig.json

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"compilerOptions": {
3+
"strict": true,
4+
"baseUrl": "../node_modules",
5+
"target": "es5",
6+
"lib": ["es5", "dom"],
7+
"types": ["cypress", "@testing-library/cypress"]
8+
},
9+
"include": ["**/*.ts"]
10+
}

‎jest.config.js

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
module.exports = {
2+
// add test-utils direct import
3+
moduleDirectories: ['node_modules', 'test'],
4+
// add jest-dom and emotion's extra matchers
5+
setupFilesAfterEnv: ['<rootDir>/test/jest.setup.js'],
6+
snapshotSerializers: ['@emotion/jest/serializer'],
7+
// coverage
8+
collectCoverageFrom: ['<rootDir>/src/**/*.{ts,tsx,js,jsx}'],
9+
// ignore cypress folder
10+
testPathIgnorePatterns: ['<rootDir>/node_modules/', '<rootDir>/cypress/'],
11+
// jest 27 introduced 'node' as new default `testEnvironment`
12+
// this can be set on a per-file basis: https://jestjs.io/docs/configuration#testenvironment-string
13+
testEnvironment: 'jsdom',
14+
};

‎next-env.d.ts

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
/// <reference types="next" />
2+
/// <reference types="next/image-types/global" />
3+
4+
// NOTE: This file should not be edited
5+
// see https://nextjs.org/docs/basic-features/typescript for more information.

‎next.config.js

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
const withMDX = require('@next/mdx')();
2+
3+
module.exports = withMDX({
4+
pageExtensions: ['js', 'mdx', 'tsx'],
5+
});

‎package.json

+66
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
{
2+
"private": true,
3+
"name": "theme-ui-next-boilerplate",
4+
"version": "1.0.0",
5+
"main": "index.js",
6+
"author": "Frederick Morin (https://freddydumont.com)",
7+
"license": "MIT",
8+
"scripts": {
9+
"dev": "next",
10+
"build": "next build",
11+
"start": "next start",
12+
"lint": "next lint",
13+
"test": "jest",
14+
"test:watch": "jest --watch",
15+
"test:cov": "jest --coverage",
16+
"typecheck": "tsc --noEmit --pretty ",
17+
"cypress:open": "cypress open",
18+
"cypress:run": "cypress run",
19+
"prepare": "husky install"
20+
},
21+
"dependencies": {
22+
"@emotion/css": "^11.9.0",
23+
"@emotion/react": "^11.9.0",
24+
"@emotion/server": "^11.4.0",
25+
"@emotion/styled": "^11.8.1",
26+
"@mdx-js/loader": "^1.6.22",
27+
"@mdx-js/react": "^1.6.22",
28+
"@next/mdx": "^12.1.6",
29+
"@theme-ui/css": "^0.14.4",
30+
"@theme-ui/presets": "^0.14.2",
31+
"@theme-ui/style-guide": "^0.14.5",
32+
"next": "^12.1.6",
33+
"next-nprogress-emotion": "^2.0.0",
34+
"react": "^17.0.2",
35+
"react-dom": "^17.0.2",
36+
"theme-ui": "^0.14.5"
37+
},
38+
"devDependencies": {
39+
"@babel/core": "^7.18.0",
40+
"@emotion/jest": "^11.9.1",
41+
"@testing-library/cypress": "^8.0.2",
42+
"@testing-library/jest-dom": "^5.16.4",
43+
"@testing-library/react": "^12.1.5",
44+
"@types/jest": "^27.5.0",
45+
"@types/node": "^17.0.35",
46+
"@types/react": "^17.0.43",
47+
"babel-jest": "^27.5.1",
48+
"cypress": "^9.6.1",
49+
"eslint": "^8.16.0",
50+
"eslint-config-next": "12.1.6",
51+
"eslint-plugin-cypress": "^2.12.1",
52+
"husky": "^8.0.1",
53+
"jest": "^27.5.1",
54+
"lint-staged": "^12.4.1",
55+
"prettier": "^2.6.2",
56+
"typescript": "^4.6.4"
57+
},
58+
"lint-staged": {
59+
"*.{ts,tsx,js}": [
60+
"yarn lint --max-warnings 0"
61+
],
62+
"*.{ts,tsx,js,css,json,md,mdx}": [
63+
"prettier --write"
64+
]
65+
}
66+
}

0 commit comments

Comments
 (0)