@netlify/plugin-nextjs 4.0.0-beta.9 → 4.0.0

package/lib/templates/getHandler.js

@@ -1,89 +1,32 @@
-const { promises, createWriteStream, existsSync } = require('fs');
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getHandler = void 0;
+const { promises } = require('fs');
 const { Server } = require('http');
-const { tmpdir } = require('os');
 const path = require('path');
-const { promisify } = require('util');
-const streamPipeline = promisify(require('stream').pipeline);
+// eslint-disable-next-line node/prefer-global/url, node/prefer-global/url-search-params
+const { URLSearchParams, URL } = require('url');
 const { Bridge } = require('@vercel/node/dist/bridge');
-const fetch = require('node-fetch');
+const { augmentFsModule, getMaxAge, getMultiValueHeaders, getNextServer } = require('./handlerUtils');
 const makeHandler = () => 
 // We return a function and then call `toString()` on it to serialise it as the launcher function
-(conf, app, pageRoot, staticManifest = []) => {
+// eslint-disable-next-line max-params
+(conf, app, pageRoot, staticManifest = [], mode = 'ssr') => {
     // This is just so nft knows about the page entrypoints. It's not actually used
     try {
         // eslint-disable-next-line node/no-missing-require
         require.resolve('./pages.js');
     }
     catch { }
+    // eslint-disable-next-line no-underscore-dangle
+    process.env._BYPASS_SSG = 'true';
+    const ONE_YEAR_IN_SECONDS = 31536000;
+    // We don't want to write ISR files to disk in the lambda environment
+    conf.experimental.isrFlushToDisk = false;
     // Set during the request as it needs the host header. Hoisted so we can define the function once
     let base;
-    // Only do this if we have some static files moved to the CDN
-    if (staticManifest.length !== 0) {
-        // These are static page files that have been removed from the function bundle
-        // In most cases these are served from the CDN, but for rewrites Next may try to read them
-        // from disk. We need to intercept these and load them from the CDN instead
-        // Sadly the only way to do this is to monkey-patch fs.promises. Yeah, I know.
-        const staticFiles = new Set(staticManifest);
-        // Yes, you can cache stuff locally in a Lambda
-        const cacheDir = path.join(tmpdir(), 'next-static-cache');
-        // Grab the real fs.promises.readFile...
-        const readfileOrig = promises.readFile;
-        // ...then money-patch it to see if it's requesting a CDN file
-        promises.readFile = async (file, options) => {
-            // We only care about page files
-            if (file.startsWith(pageRoot)) {
-                // We only want the part after `pages/`
-                const filePath = file.slice(pageRoot.length + 1);
-                // Is it in the CDN and not local?
-                if (staticFiles.has(filePath) && !existsSync(file)) {
-                    // This name is safe to use, because it's one that was already created by Next
-                    const cacheFile = path.join(cacheDir, filePath);
-                    // Have we already cached it? We ignore the cache if running locally to avoid staleness
-                    if ((!existsSync(cacheFile) || process.env.NETLIFY_DEV) && base) {
-                        await promises.mkdir(path.dirname(cacheFile), { recursive: true });
-                        // Append the path to our host and we can load it like a regular page
-                        const url = `${base}/${filePath}`;
-                        console.log(`Downloading ${url} to ${cacheFile}`);
-                        const response = await fetch(url);
-                        if (!response.ok) {
-                            // Next catches this and returns it as a not found file
-                            throw new Error(`Failed to fetch ${url}`);
-                        }
-                        // Stream it to disk
-                        await streamPipeline(response.body, createWriteStream(cacheFile));
-                    }
-                    // Return the cache file
-                    return readfileOrig(cacheFile, options);
-                }
-            }
-            return readfileOrig(file, options);
-        };
-    }
-    let NextServer;
-    try {
-        // next >= 11.0.1. Yay breaking changes in patch releases!
-        NextServer = require('next/dist/server/next-server').default;
-    }
-    catch (error) {
-        if (!error.message.includes("Cannot find module 'next/dist/server/next-server'")) {
-            // A different error, so rethrow it
-            throw error;
-        }
-        // Probably an old version of next
-    }
-    if (!NextServer) {
-        try {
-            // next < 11.0.1
-            // eslint-disable-next-line node/no-missing-require, import/no-unresolved
-            NextServer = require('next/dist/next-server/server/next-server').default;
-        }
-        catch (error) {
-            if (!error.message.includes("Cannot find module 'next/dist/next-server/server/next-server'")) {
-                throw error;
-            }
-            throw new Error('Could not find Next.js server');
-        }
-    }
+    augmentFsModule({ promises, staticManifest, pageRoot, getBase: () => base });
+    const NextServer = getNextServer();
     const nextServer = new NextServer({
         conf,
         dir: path.resolve(__dirname, app),
@@ -102,9 +45,10 @@ const makeHandler = () =>
     const bridge = new Bridge(server);
     bridge.listen();
     return async (event, context) => {
-        var _a, _b, _c, _d;
+        var _a, _b, _c;
+        let requestMode = mode;
         // Ensure that paths are encoded - but don't double-encode them
-        event.path = new URL(event.path, event.rawUrl).pathname;
+        event.path = new URL(event.rawUrl).pathname;
         // Next expects to be able to parse the query from the URL
         const query = new URLSearchParams(event.queryStringParameters).toString();
         event.path = query ? `${event.path}?${query}` : event.path;
@@ -115,25 +59,27 @@ const makeHandler = () =>
             base = `${protocol}://${host}`;
         }
         const { headers, ...result } = await bridge.launcher(event, context);
-        /** @type import("@netlify/functions").HandlerResponse */
         // Convert all headers to multiValueHeaders
-        const multiValueHeaders = {};
-        for (const key of Object.keys(headers)) {
-            if (Array.isArray(headers[key])) {
-                multiValueHeaders[key] = headers[key];
-            }
-            else {
-                multiValueHeaders[key] = [headers[key]];
-            }
-        }
+        const multiValueHeaders = getMultiValueHeaders(headers);
         if ((_b = (_a = multiValueHeaders['set-cookie']) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.includes('__prerender_bypass')) {
             delete multiValueHeaders.etag;
             multiValueHeaders['cache-control'] = ['no-cache'];
         }
         // Sending SWR headers causes undefined behaviour with the Netlify CDN
-        if ((_d = (_c = multiValueHeaders['cache-control']) === null || _c === void 0 ? void 0 : _c[0]) === null || _d === void 0 ? void 0 : _d.includes('stale-while-revalidate')) {
+        const cacheHeader = (_c = multiValueHeaders['cache-control']) === null || _c === void 0 ? void 0 : _c[0];
+        if (cacheHeader === null || cacheHeader === void 0 ? void 0 : cacheHeader.includes('stale-while-revalidate')) {
+            if (requestMode === 'odb') {
+                requestMode = 'isr';
+                const ttl = getMaxAge(cacheHeader);
+                // Long-expiry TTL is basically no TTL
+                if (ttl > 0 && ttl < ONE_YEAR_IN_SECONDS) {
+                    result.ttl = ttl;
+                }
+                multiValueHeaders['x-rendered-at'] = [new Date().toISOString()];
+            }
             multiValueHeaders['cache-control'] = ['public, max-age=0, must-revalidate'];
         }
+        multiValueHeaders['x-render-mode'] = [requestMode];
         return {
             ...result,
             multiValueHeaders,
@@ -143,13 +89,10 @@ const makeHandler = () =>
 };
 const getHandler = ({ isODB = false, publishDir = '../../../.next', appDir = '../../..' }) => `
 const { Server } = require("http");
-const { tmpdir } = require('os')
-const { promises, createWriteStream, existsSync } = require("fs");
-const { promisify } = require('util')
-const streamPipeline = promisify(require('stream').pipeline)
+const { promises } = require("fs");
 // We copy the file here rather than requiring from the node module
 const { Bridge } = require("./bridge");
-const fetch = require('node-fetch')
+const { augmentFsModule, getMaxAge, getMultiValueHeaders, getNextServer } = require('./handlerUtils')
 
 const { builder } = require("@netlify/functions");
 const { config }  = require("${publishDir}/required-server-files.json")
@@ -160,7 +103,8 @@ try {
 const path = require("path");
 const pageRoot = path.resolve(path.join(__dirname, "${publishDir}", config.target === "server" ? "server" : "serverless", "pages"));
 exports.handler = ${isODB
-    ? `builder((${makeHandler().toString()})(config, "${appDir}", pageRoot, staticManifest));`
-    : `(${makeHandler().toString()})(config, "${appDir}", pageRoot, staticManifest);`}
+    ? `builder((${makeHandler().toString()})(config, "${appDir}", pageRoot, staticManifest, 'odb'));`
+    : `(${makeHandler().toString()})(config, "${appDir}", pageRoot, staticManifest, 'ssr');`}
 `;
-module.exports = getHandler;
+exports.getHandler = getHandler;
+/* eslint-enable @typescript-eslint/no-var-requires */

package/lib/templates/getPageResolver.js

@@ -1,19 +1,27 @@
-const { posix: { resolve, join, relative }, } = require('path');
-const { outdent } = require('outdent');
-const slash = require('slash');
-const glob = require('tiny-glob');
-const { HANDLER_FUNCTION_NAME } = require('../constants');
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getPageResolver = void 0;
+const path_1 = require("path");
+const outdent_1 = require("outdent");
+const slash_1 = __importDefault(require("slash"));
+const tiny_glob_1 = __importDefault(require("tiny-glob"));
+const constants_1 = require("../constants");
 // Generate a file full of require.resolve() calls for all the pages in the
 // build. This is used by the nft bundler to find all the pages.
-exports.getPageResolver = async ({ netlifyConfig, target }) => {
-    const functionDir = resolve(join('.netlify', 'functions', HANDLER_FUNCTION_NAME));
-    const root = join(netlifyConfig.build.publish, target === 'server' ? 'server' : 'serverless', 'pages');
-    const pages = await glob('**/*.js', {
+const getPageResolver = async ({ publish, target }) => {
+    const functionDir = path_1.posix.resolve(path_1.posix.join('.netlify', 'functions', constants_1.HANDLER_FUNCTION_NAME));
+    const root = path_1.posix.resolve(slash_1.default(publish), target === 'server' ? 'server' : 'serverless', 'pages');
+    const pages = await tiny_glob_1.default('**/*.js', {
         cwd: root,
         dot: true,
     });
-    const pageFiles = pages.map((page) => `require.resolve('${relative(functionDir, join(root, slash(page)))}')`).sort();
-    return outdent `
+    const pageFiles = pages
+        .map((page) => `require.resolve('${path_1.posix.relative(functionDir, path_1.posix.join(root, slash_1.default(page)))}')`)
+        .sort();
+    return outdent_1.outdent `
     // This file is purely to allow nft to know about these pages. It should be temporary.
     exports.resolvePages = () => {
         try {
@@ -22,3 +30,4 @@ exports.getPageResolver = async ({ netlifyConfig, target }) => {
     }
   `;
 };
+exports.getPageResolver = getPageResolver;

package/lib/templates/handlerUtils.js

@@ -0,0 +1,162 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getNextServer = exports.augmentFsModule = exports.getMultiValueHeaders = exports.getMaxAge = exports.downloadFile = void 0;
+const fs_1 = require("fs");
+const http_1 = __importDefault(require("http"));
+const https_1 = __importDefault(require("https"));
+const os_1 = require("os");
+const path_1 = __importDefault(require("path"));
+const stream_1 = require("stream");
+const util_1 = require("util");
+const streamPipeline = util_1.promisify(stream_1.pipeline);
+const downloadFile = async (url, destination) => {
+    console.log(`Downloading ${url} to ${destination}`);
+    const httpx = url.startsWith('https') ? https_1.default : http_1.default;
+    await new Promise((resolve, reject) => {
+        const req = httpx.get(url, { timeout: 10000 }, (response) => {
+            if (response.statusCode < 200 || response.statusCode > 299) {
+                reject(new Error(`Failed to download ${url}: ${response.statusCode} ${response.statusMessage || ''}`));
+                return;
+            }
+            const fileStream = fs_1.createWriteStream(destination);
+            streamPipeline(response, fileStream)
+                .then(resolve)
+                .catch((error) => {
+                console.log(`Error downloading ${url}`, error);
+                reject(error);
+            });
+        });
+        req.on('error', (error) => {
+            console.log(`Error downloading ${url}`, error);
+            reject(error);
+        });
+    });
+};
+exports.downloadFile = downloadFile;
+const getMaxAge = (header) => {
+    const parts = header.split(',');
+    let maxAge;
+    for (const part of parts) {
+        const [key, value] = part.split('=');
+        if ((key === null || key === void 0 ? void 0 : key.trim()) === 's-maxage') {
+            maxAge = value === null || value === void 0 ? void 0 : value.trim();
+        }
+    }
+    if (maxAge) {
+        const result = Number.parseInt(maxAge);
+        return Number.isNaN(result) ? 0 : result;
+    }
+    return 0;
+};
+exports.getMaxAge = getMaxAge;
+const getMultiValueHeaders = (headers) => {
+    const multiValueHeaders = {};
+    for (const key of Object.keys(headers)) {
+        const header = headers[key];
+        if (Array.isArray(header)) {
+            multiValueHeaders[key] = header;
+        }
+        else {
+            multiValueHeaders[key] = [header];
+        }
+    }
+    return multiValueHeaders;
+};
+exports.getMultiValueHeaders = getMultiValueHeaders;
+const augmentFsModule = ({ promises, staticManifest, pageRoot, getBase, }) => {
+    // Only do this if we have some static files moved to the CDN
+    if (staticManifest.length === 0) {
+        return;
+    }
+    // These are static page files that have been removed from the function bundle
+    // In most cases these are served from the CDN, but for rewrites Next may try to read them
+    // from disk. We need to intercept these and load them from the CDN instead
+    // Sadly the only way to do this is to monkey-patch fs.promises. Yeah, I know.
+    const staticFiles = new Map(staticManifest);
+    const downloadPromises = new Map();
+    // Yes, you can cache stuff locally in a Lambda
+    const cacheDir = path_1.default.join(os_1.tmpdir(), 'next-static-cache');
+    // Grab the real fs.promises.readFile...
+    const readfileOrig = promises.readFile;
+    const statsOrig = promises.stat;
+    // ...then money-patch it to see if it's requesting a CDN file
+    promises.readFile = (async (file, options) => {
+        const base = getBase();
+        // We only care about page files
+        if (file.startsWith(pageRoot)) {
+            // We only want the part after `pages/`
+            const filePath = file.slice(pageRoot.length + 1);
+            // Is it in the CDN and not local?
+            if (staticFiles.has(filePath) && !fs_1.existsSync(file)) {
+                // This name is safe to use, because it's one that was already created by Next
+                const cacheFile = path_1.default.join(cacheDir, filePath);
+                const url = `${base}/${staticFiles.get(filePath)}`;
+                // If it's already downloading we can wait for it to finish
+                if (downloadPromises.has(url)) {
+                    await downloadPromises.get(url);
+                }
+                // Have we already cached it? We download every time if running locally to avoid staleness
+                if ((!fs_1.existsSync(cacheFile) || process.env.NETLIFY_DEV) && base) {
+                    await promises.mkdir(path_1.default.dirname(cacheFile), { recursive: true });
+                    try {
+                        // Append the path to our host and we can load it like a regular page
+                        const downloadPromise = exports.downloadFile(url, cacheFile);
+                        downloadPromises.set(url, downloadPromise);
+                        await downloadPromise;
+                    }
+                    finally {
+                        downloadPromises.delete(url);
+                    }
+                }
+                // Return the cache file
+                return readfileOrig(cacheFile, options);
+            }
+        }
+        return readfileOrig(file, options);
+    });
+    promises.stat = ((file, options) => {
+        // We only care about page files
+        if (file.startsWith(pageRoot)) {
+            // We only want the part after `pages/`
+            const cacheFile = path_1.default.join(cacheDir, file.slice(pageRoot.length + 1));
+            if (fs_1.existsSync(cacheFile)) {
+                return statsOrig(cacheFile, options);
+            }
+        }
+        return statsOrig(file, options);
+    });
+};
+exports.augmentFsModule = augmentFsModule;
+const getNextServer = () => {
+    let NextServer;
+    try {
+        // next >= 11.0.1. Yay breaking changes in patch releases!
+        // eslint-disable-next-line @typescript-eslint/no-var-requires
+        NextServer = require('next/dist/server/next-server').default;
+    }
+    catch (error) {
+        if (!error.message.includes("Cannot find module 'next/dist/server/next-server'")) {
+            // A different error, so rethrow it
+            throw error;
+        }
+        // Probably an old version of next
+    }
+    if (!NextServer) {
+        try {
+            // next < 11.0.1
+            // eslint-disable-next-line node/no-missing-require, import/no-unresolved, @typescript-eslint/no-var-requires
+            NextServer = require('next/dist/next-server/server/next-server').default;
+        }
+        catch (error) {
+            if (!error.message.includes("Cannot find module 'next/dist/next-server/server/next-server'")) {
+                throw error;
+            }
+            throw new Error('Could not find Next.js server');
+        }
+    }
+    return NextServer;
+};
+exports.getNextServer = getNextServer;

package/lib/templates/ipx.js

@@ -1,8 +1,12 @@
-const { createIPXHandler } = require('@netlify/ipx');
-// Injected at build time
-// eslint-disable-next-line import/no-unresolved, node/no-missing-require
-const { basePath, domains } = require('./imageconfig.json');
-exports.handler = createIPXHandler({
-    basePath,
-    domains,
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.handler = void 0;
+/* eslint-disable node/no-missing-import, import/no-unresolved, @typescript-eslint/ban-ts-comment  */
+const ipx_1 = require("@netlify/ipx");
+// @ts-ignore Injected at build time
+const imageconfig_json_1 = require("./imageconfig.json");
+exports.handler = ipx_1.createIPXHandler({
+    basePath: imageconfig_json_1.basePath,
+    domains: imageconfig_json_1.domains,
 });
+/* eslint-enable node/no-missing-import, import/no-unresolved, @typescript-eslint/ban-ts-comment  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@netlify/plugin-nextjs",
-  "version": "4.0.0-beta.9",
+  "version": "4.0.0",
   "description": "Run Next.js seamlessly on Netlify",
   "main": "lib/index.js",
   "files": [
@@ -8,10 +8,9 @@
     "manifest.yml"
   ],
   "scripts": {
-    "build:demo": "next build demo",
+    "build:demo": "next build demos/default",
     "cy:open": "cypress open --config-file cypress/config/all.json",
-    "cy:run": "cypress run --config-file ../cypress/config/ci.json",
-    "dev:demo": "next dev demo",
+    "dev:demo": "next dev demos/default",
     "format": "run-s format:check-fix:*",
     "format:ci": "run-s format:check:*",
     "format:check-fix:lint": "run-e format:check:lint format:fix:lint",
@@ -26,14 +25,16 @@
     "publish:test": "npm test",
     "test": "run-s build build:demo test:jest",
     "test:jest": "jest",
+    "test:jest:update": "jest --updateSnapshot",
+    "test:update": "run-s build build:demo test:jest:update",
     "prepare": "npm run build",
     "clean": "rimraf lib",
     "build": "tsc",
     "watch": "tsc --watch"
   },
   "config": {
-    "eslint": "--cache --format=codeframe --max-warnings=0 \"{src,scripts,tests,.github}/**/*.{js,md,html}\" \"*.{js,md,html}\" \".*.{js,md,html}\"",
-    "prettier": "--loglevel=warn \"{src,scripts,tests,.github}/**/*.{js,md,yml,json,html}\" \"*.{js,yml,json,html}\" \".*.{js,yml,json,html}\" \"!package-lock.json\""
+    "eslint": "--cache --format=codeframe --max-warnings=0 \"{src,scripts,tests,.github}/**/*.{ts,js,md,html}\" \"*.{ts,js,md,html}\" \".*.{ts,js,md,html}\"",
+    "prettier": "--loglevel=warn \"{src,scripts,tests,.github}/**/*.{ts,js,md,yml,json,html}\" \"*.{ts,js,yml,json,html}\" \".*.{ts,js,yml,json,html}\" \"!package-lock.json\""
   },
   "repository": {
     "type": "git",
@@ -52,8 +53,8 @@
   },
   "homepage": "https://github.com/netlify/netlify-plugin-nextjs#readme",
   "dependencies": {
-    "@netlify/functions": "^0.9.0",
-    "@netlify/ipx": "^0.0.7",
+    "@netlify/functions": "^0.10.0",
+    "@netlify/ipx": "^0.0.8",
     "@vercel/node": "^1.11.2-canary.4",
     "chalk": "^4.1.2",
     "fs-extra": "^10.0.0",
@@ -72,16 +73,17 @@
   "devDependencies": {
     "@babel/core": "^7.15.8",
     "@babel/preset-env": "^7.15.8",
-    "@netlify/build": "^18.25.1",
-    "@netlify/eslint-config-node": "^3.3.7",
+    "@babel/preset-typescript": "^7.16.0",
+    "@netlify/build": "^20.3.0",
+    "@netlify/eslint-config-node": "^4.0.0",
     "@testing-library/cypress": "^8.0.1",
     "@types/fs-extra": "^9.0.13",
     "@types/jest": "^27.0.2",
     "@types/mocha": "^9.0.0",
     "babel-jest": "^27.2.5",
     "cpy": "^8.1.2",
-    "cypress": "^8.5.0",
-    "eslint-config-next": "^11.0.0",
+    "cypress": "^9.0.0",
+    "eslint-config-next": "^12.0.0",
     "husky": "^4.3.0",
     "jest": "^27.0.0",
     "netlify-plugin-cypress": "^2.2.0",