Skip to content

Commit 9095c82

Browse files
sarahettersarahetter
authored
feat: add support for experimental image remotePatterns (#1375)
* feat: add canary demo site * chore: add space * chore: remove eslint next * chore: testing wildcard * feat: passing remotePatterns into ipx * feat: upgrade netlify/ipx * chore: add eslint-disable for max-lines * feat: wildcard remotePattern in demo site * chore: add .netlify to gitignore * chore: remote confusing language * chore: add cypress tests * chore: update to match non-default demo actions * chore: add new ignore to netlify toml * chore: update package lock * chore: add projectId * chore: update plugin next version
1 parent 3674b1c commit 9095c82

File tree

20 files changed

+2611
-44
lines changed

20 files changed

+2611
-44
lines changed

‎.github/workflows/cypress-canary.yml

+73
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
name: Run e2e (canary demo)
2+
on:
3+
pull_request:
4+
types: [opened, labeled, unlabeled, synchronize]
5+
push:
6+
branches:
7+
- main
8+
paths:
9+
- 'demos/canary/**/*.{js,jsx,ts,tsx}'
10+
- 'cypress/integration/canary/**/*.{ts,js}'
11+
- 'src/**/*.{ts,js}'
12+
jobs:
13+
cypress:
14+
name: Cypress
15+
runs-on: ubuntu-latest
16+
strategy:
17+
fail-fast: false
18+
matrix:
19+
containers: [1, 2, 3, 4]
20+
steps:
21+
- name: Checkout
22+
uses: actions/checkout@v2
23+
24+
- name: Generate Github token
25+
uses: navikt/github-app-token-generator@v1
26+
id: get-token
27+
with:
28+
private-key: ${{ secrets.TOKENS_PRIVATE_KEY }}
29+
app-id: ${{ secrets.TOKENS_APP_ID }}
30+
31+
- name: Checkout @netlify/wait-for-deploy-action
32+
uses: actions/checkout@v2
33+
with:
34+
repository: netlify/wait-for-deploy-action
35+
token: ${{ steps.get-token.outputs.token }}
36+
path: ./.github/actions/wait-for-netlify-deploy
37+
38+
- name: Wait for Netlify Deploy
39+
id: deploy
40+
uses: ./.github/actions/wait-for-netlify-deploy
41+
with:
42+
site-name: netlify-plugin-nextjs-demo
43+
timeout: 300
44+
45+
- name: Deploy successful
46+
if: ${{ steps.deploy.outputs.origin-url }}
47+
run: echo ${{ steps.deploy.outputs.origin-url }}
48+
49+
- name: Node
50+
uses: actions/setup-node@v2
51+
with:
52+
node-version: '16'
53+
54+
- run: npm install
55+
56+
- name: Cypress run
57+
if: ${{ steps.deploy.outputs.origin-url }}
58+
id: cypress
59+
uses: cypress-io/github-action@v2
60+
with:
61+
browser: chrome
62+
headless: true
63+
record: true
64+
parallel: true
65+
config-file: cypress/config/canary.json
66+
group: 'Next Plugin - Demo Canary'
67+
spec: cypress/integration/canary/*
68+
env:
69+
DEBUG: '@cypress/github-action'
70+
CYPRESS_baseUrl: ${{ steps.deploy.outputs.origin-url }}
71+
CYPRESS_NETLIFY_CONTEXT: ${{ steps.deploy.outputs.context }}
72+
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
73+
CYPRESS_RECORD_KEY: ${{ secrets.CANARY_CYPRESS_RECORD_KEY }}

‎cypress/config/canary.json

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"baseUrl": "http://localhost:3000",
3+
"integrationFolder": "cypress/integration/canary",
4+
"projectId": "5zbkdv"
5+
}

‎cypress/integration/canary/images.spec.ts

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
/**
2+
* @see {@link https://nextjs.org/docs/api-reference/next/image#required-props}
3+
*/
4+
describe('next/images', () => {
5+
it('should show image from /public', () => {
6+
cy.visit('/')
7+
cy.findByRole('img').should('be.visible').and(($img) => {
8+
// "naturalWidth" and "naturalHeight" are set when the image loads
9+
expect(
10+
$img[0].naturalWidth,
11+
'image has natural width'
12+
).to.be.greaterThan(0)
13+
})
14+
})
15+
})

‎demos/canary/.eslintrc.json

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

‎demos/canary/.gitignore

+35
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
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+
11+
# next.js
12+
/.next/
13+
/out/
14+
15+
# production
16+
/build
17+
18+
# misc
19+
.DS_Store
20+
*.pem
21+
22+
# debug
23+
npm-debug.log*
24+
yarn-debug.log*
25+
yarn-error.log*
26+
.pnpm-debug.log*
27+
28+
# local env files
29+
.env*.local
30+
31+
# vercel
32+
.vercel
33+
34+
# netlify
35+
.netlify

‎demos/canary/README.md

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
2+
3+
## Getting Started
4+
5+
First, run the development server:
6+
7+
```bash
8+
npm run dev
9+
# or
10+
yarn dev
11+
```
12+
13+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
14+
15+
You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
16+
17+
[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.js`.
18+
19+
The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
20+
21+
## Learn More
22+
23+
To learn more about Next.js, take a look at the following resources:
24+
25+
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
26+
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
27+
28+
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!

‎demos/canary/netlify.toml

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
[build]
2+
command = "next build"
3+
publish = ".next"
4+
ignore = "if [ $CACHED_COMMIT_REF == $COMMIT_REF ]; then (exit 1); else git diff --quiet $CACHED_COMMIT_REF $COMMIT_REF . ../../plugin; fi;"
5+
6+
[build.environment]
7+
TERM = "xterm"
8+
NODE_VERSION = "17"
9+
10+
[[plugins]]
11+
package = "../plugin-wrapper/"
12+
13+
# This is a fake plugin, that makes it run npm install
14+
[[plugins]]
15+
package = "@netlify/plugin-local-install-core"

‎demos/canary/next.config.js

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
/** @type {import('next').NextConfig} */
2+
const nextConfig = {
3+
reactStrictMode: true,
4+
eslint: {
5+
// Warning: This allows production builds to successfully complete even if
6+
// your project has ESLint errors.
7+
ignoreDuringBuilds: true,
8+
},
9+
experimental: {
10+
images: {
11+
remotePatterns: [
12+
{
13+
protocol: 'https',
14+
hostname: '*.githubusercontent.com',
15+
},
16+
],
17+
},
18+
},
19+
}
20+
21+
module.exports = nextConfig

0 commit comments

Comments
 (0)