From 44afaf58762e1685fcf895b1e87a860c3ae9973a Mon Sep 17 00:00:00 2001 From: Michal Piechowiak Date: Mon, 13 Sep 2021 16:12:03 +0200 Subject: [PATCH] fix(gatsby): fix hydration flicker on initial render of ssr page (#33134) * inline page-data object in html when it contains serverData * skip settting page-data preload link header for ssr pages --- .../build-headers-program.js.snap | 8 +++---- .../src/__tests__/build-headers-program.js | 22 ++++++++++++++++--- .../src/build-headers-program.js | 13 +++-------- packages/gatsby/cache-dir/loader.js | 10 ++++++++- packages/gatsby/cache-dir/production-app.js | 2 +- packages/gatsby/cache-dir/static-entry.js | 7 ++++-- .../gatsby/src/utils/page-ssr-module/entry.ts | 1 + 7 files changed, 42 insertions(+), 21 deletions(-) diff --git a/packages/gatsby-plugin-gatsby-cloud/src/__tests__/__snapshots__/build-headers-program.js.snap b/packages/gatsby-plugin-gatsby-cloud/src/__tests__/__snapshots__/build-headers-program.js.snap index 147dd943233b9..2ab297531110c 100644 --- a/packages/gatsby-plugin-gatsby-cloud/src/__tests__/__snapshots__/build-headers-program.js.snap +++ b/packages/gatsby-plugin-gatsby-cloud/src/__tests__/__snapshots__/build-headers-program.js.snap @@ -1,9 +1,9 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`build-headers-program with caching headers 1`] = `"{\\"/*\\":[\\"X-Frame-Options: DENY\\",\\"X-XSS-Protection: 1; mode=block\\",\\"X-Content-Type-Options: nosniff\\",\\"Referrer-Policy: same-origin\\"],\\"/component---node-modules-gatsby-plugin-offline-app-shell-js-78f9e4dea04737fa062d.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/0-0180cd94ef2497ac7db8.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-templates-blog-post-js-517987eae96e75cddbe7.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-404-js-53e6c51a5a7e73090f50.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-index-js-0bdd01c77ee09ef0224c.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/webpack-runtime-acaa8994f1f704475e21.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles.1025963f4f2ec7abbad4.css\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles-565f081c8374bbda155f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/app-f33c13590352da20930f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/static/*\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/sw.js\\":[\\"Cache-Control: public, max-age=0, must-revalidate\\"],\\"/offline-plugin-app-shell-fallback/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hi-folks/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/my-second-post/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hello-world/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404.html\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"]}"`; +exports[`build-headers-program with caching headers 1`] = `"{\\"/*\\":[\\"X-Frame-Options: DENY\\",\\"X-XSS-Protection: 1; mode=block\\",\\"X-Content-Type-Options: nosniff\\",\\"Referrer-Policy: same-origin\\"],\\"/component---node-modules-gatsby-plugin-offline-app-shell-js-78f9e4dea04737fa062d.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/0-0180cd94ef2497ac7db8.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-templates-blog-post-js-517987eae96e75cddbe7.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-404-js-53e6c51a5a7e73090f50.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-index-js-0bdd01c77ee09ef0224c.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/webpack-runtime-acaa8994f1f704475e21.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles.1025963f4f2ec7abbad4.css\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles-565f081c8374bbda155f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/app-f33c13590352da20930f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/static/*\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/sw.js\\":[\\"Cache-Control: public, max-age=0, must-revalidate\\"],\\"/offline-plugin-app-shell-fallback/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hi-folks/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/my-second-post/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hello-world/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/test/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404.html\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"]}"`; -exports[`build-headers-program with manifest['pages-manifest'] 1`] = `"{\\"/*\\":[\\"X-Frame-Options: DENY\\",\\"X-XSS-Protection: 1; mode=block\\",\\"X-Content-Type-Options: nosniff\\",\\"Referrer-Policy: same-origin\\"],\\"/component---node-modules-gatsby-plugin-offline-app-shell-js-78f9e4dea04737fa062d.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/0-0180cd94ef2497ac7db8.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-templates-blog-post-js-517987eae96e75cddbe7.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-404-js-53e6c51a5a7e73090f50.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-index-js-0bdd01c77ee09ef0224c.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/pages-manifest-ab11f09e0ca7ecd3b43e.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/webpack-runtime-acaa8994f1f704475e21.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles.1025963f4f2ec7abbad4.css\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles-565f081c8374bbda155f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/app-f33c13590352da20930f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/static/*\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/sw.js\\":[\\"Cache-Control: public, max-age=0, must-revalidate\\"],\\"/offline-plugin-app-shell-fallback/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\"],\\"/hi-folks/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\"],\\"/my-second-post/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\"],\\"/hello-world/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\"],\\"/404/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\"],\\"/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\"],\\"/404.html\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\"]}"`; +exports[`build-headers-program with manifest['pages-manifest'] 1`] = `"{\\"/*\\":[\\"X-Frame-Options: DENY\\",\\"X-XSS-Protection: 1; mode=block\\",\\"X-Content-Type-Options: nosniff\\",\\"Referrer-Policy: same-origin\\"],\\"/component---node-modules-gatsby-plugin-offline-app-shell-js-78f9e4dea04737fa062d.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/0-0180cd94ef2497ac7db8.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-templates-blog-post-js-517987eae96e75cddbe7.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-404-js-53e6c51a5a7e73090f50.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-index-js-0bdd01c77ee09ef0224c.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/pages-manifest-ab11f09e0ca7ecd3b43e.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/webpack-runtime-acaa8994f1f704475e21.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles.1025963f4f2ec7abbad4.css\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles-565f081c8374bbda155f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/app-f33c13590352da20930f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/static/*\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/sw.js\\":[\\"Cache-Control: public, max-age=0, must-revalidate\\"],\\"/offline-plugin-app-shell-fallback/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hi-folks/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/my-second-post/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hello-world/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/test/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\"],\\"/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404.html\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"]}"`; -exports[`build-headers-program with security headers 1`] = `"{\\"/*\\":[\\"X-Frame-Options: ALLOW-FROM https://app.storyblok.com/\\",\\"X-XSS-Protection: 1; mode=block\\",\\"X-Content-Type-Options: nosniff\\",\\"Referrer-Policy: same-origin\\",\\"Content-Security-Policy: frame-ancestors 'self' https://*.storyblok.com/\\"],\\"/hello\\":[\\"X-Frame-Options: SAMEORIGIN\\"],\\"/component---node-modules-gatsby-plugin-offline-app-shell-js-78f9e4dea04737fa062d.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/0-0180cd94ef2497ac7db8.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-templates-blog-post-js-517987eae96e75cddbe7.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-404-js-53e6c51a5a7e73090f50.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-index-js-0bdd01c77ee09ef0224c.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/webpack-runtime-acaa8994f1f704475e21.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles.1025963f4f2ec7abbad4.css\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles-565f081c8374bbda155f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/app-f33c13590352da20930f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/static/*\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/sw.js\\":[\\"Cache-Control: public, max-age=0, must-revalidate\\"],\\"/offline-plugin-app-shell-fallback/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hi-folks/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/my-second-post/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hello-world/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404.html\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"]}"`; +exports[`build-headers-program with security headers 1`] = `"{\\"/*\\":[\\"X-Frame-Options: ALLOW-FROM https://app.storyblok.com/\\",\\"X-XSS-Protection: 1; mode=block\\",\\"X-Content-Type-Options: nosniff\\",\\"Referrer-Policy: same-origin\\",\\"Content-Security-Policy: frame-ancestors 'self' https://*.storyblok.com/\\"],\\"/hello\\":[\\"X-Frame-Options: SAMEORIGIN\\"],\\"/component---node-modules-gatsby-plugin-offline-app-shell-js-78f9e4dea04737fa062d.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/0-0180cd94ef2497ac7db8.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-templates-blog-post-js-517987eae96e75cddbe7.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-404-js-53e6c51a5a7e73090f50.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/component---src-pages-index-js-0bdd01c77ee09ef0224c.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/webpack-runtime-acaa8994f1f704475e21.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles.1025963f4f2ec7abbad4.css\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/styles-565f081c8374bbda155f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/app-f33c13590352da20930f.js\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/static/*\\":[\\"Cache-Control: public, max-age=31536000, immutable\\"],\\"/sw.js\\":[\\"Cache-Control: public, max-age=0, must-revalidate\\"],\\"/offline-plugin-app-shell-fallback/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hi-folks/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/my-second-post/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hello-world/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/test/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404.html\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"]}"`; -exports[`build-headers-program without caching headers 1`] = `"{\\"/*\\":[\\"X-Frame-Options: DENY\\",\\"X-XSS-Protection: 1; mode=block\\",\\"X-Content-Type-Options: nosniff\\",\\"Referrer-Policy: same-origin\\"],\\"/offline-plugin-app-shell-fallback/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hi-folks/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/my-second-post/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hello-world/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404.html\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"]}"`; +exports[`build-headers-program without caching headers 1`] = `"{\\"/*\\":[\\"X-Frame-Options: DENY\\",\\"X-XSS-Protection: 1; mode=block\\",\\"X-Content-Type-Options: nosniff\\",\\"Referrer-Policy: same-origin\\"],\\"/offline-plugin-app-shell-fallback/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hi-folks/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/my-second-post/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/hello-world/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/test/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"],\\"/404.html\\":[\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=script; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\",\\"Link: ; rel=preload; as=fetch; crossorigin; nopush\\"]}"`; diff --git a/packages/gatsby-plugin-gatsby-cloud/src/__tests__/build-headers-program.js b/packages/gatsby-plugin-gatsby-cloud/src/__tests__/build-headers-program.js index ab467262bdd60..2fb4ea6bc1692 100644 --- a/packages/gatsby-plugin-gatsby-cloud/src/__tests__/build-headers-program.js +++ b/packages/gatsby-plugin-gatsby-cloud/src/__tests__/build-headers-program.js @@ -125,6 +125,22 @@ describe(`build-headers-program`, () => { pluginCreatorId: `049c1cfd-95f7-5555-a4ac-9b396d098b26`, }, ], + [ + `/test/`, + { + jsonName: `test`, + internalComponentName: `ComponentTest`, + path: `/test/`, + matchPath: undefined, + componentChunkName: `component---src-pages-test-js`, + isCreatedByStatefulCreatePages: true, + context: {}, + updatedAt: 1557740602361, + pluginCreator___NODE: `049c1cfd-95f7-5555-a4ac-9b396d098b26`, + pluginCreatorId: `049c1cfd-95f7-5555-a4ac-9b396d098b26`, + mode: `SSR`, + }, + ], [ `/`, { @@ -203,8 +219,8 @@ describe(`build-headers-program`, () => { expect(output).toMatchSnapshot() expect(output).toMatch(/app-data\.json/) expect(output).toMatch(/page-data\.json/) - // we should only check page-data & app-data once which leads to 2 times - expect(fs.existsSync).toBeCalledTimes(2) + // we should only check app-data once which leads to 1 time + expect(fs.existsSync).toBeCalledTimes(1) }) it(`with manifest['pages-manifest']`, async () => { @@ -237,7 +253,7 @@ describe(`build-headers-program`, () => { expect(output).toMatchSnapshot() expect(output).toMatch(/\/pages-manifest-ab11f09e0ca7ecd3b43e\.js/g) expect(output).not.toMatch(/\/app-data\.json/g) - expect(output).not.toMatch(/\/page-data\.json/g) + expect(output).toMatch(/\/page-data\.json/g) expect(output).not.toMatch(/\/undefined/g) }) diff --git a/packages/gatsby-plugin-gatsby-cloud/src/build-headers-program.js b/packages/gatsby-plugin-gatsby-cloud/src/build-headers-program.js index f65f147685e86..71d37545221b7 100644 --- a/packages/gatsby-plugin-gatsby-cloud/src/build-headers-program.js +++ b/packages/gatsby-plugin-gatsby-cloud/src/build-headers-program.js @@ -100,15 +100,6 @@ function preloadHeadersByPage({ pages, manifest, pathPrefix, publicFolder }) { const appDataPath = publicFolder(PAGE_DATA_DIR, `app-data.json`) const hasAppData = existsSync(appDataPath) - let hasPageData = false - if (pages.size) { - // test if 1 page-data file exists, if it does we know we're on a gatsby version that supports page-data - const pageDataPath = publicFolder( - getPageDataPath(pages.get(pages.keys().next().value).path) - ) - hasPageData = existsSync(pageDataPath) - } - pages.forEach(page => { const scripts = _.flatMap(COMMON_BUNDLES, file => getScriptPath(file, manifest) @@ -121,7 +112,9 @@ function preloadHeadersByPage({ pages, manifest, pathPrefix, publicFolder }) { json.push(posix.join(PAGE_DATA_DIR, `app-data.json`)) } - if (hasPageData) { + // page-data gets inline for SSR, so we won't be doing page-data request + // and we shouldn't add preload link header for it. + if (page.mode !== `SSR`) { json.push(getPageDataPath(page.path)) } diff --git a/packages/gatsby/cache-dir/loader.js b/packages/gatsby/cache-dir/loader.js index 1a1e227718bde..9226b99eb7ae2 100644 --- a/packages/gatsby/cache-dir/loader.js +++ b/packages/gatsby/cache-dir/loader.js @@ -487,7 +487,7 @@ const createComponentUrls = componentChunkName => ) export class ProdLoader extends BaseLoader { - constructor(asyncRequires, matchPaths) { + constructor(asyncRequires, matchPaths, pageData) { const loadComponent = chunkName => { if (!asyncRequires.components[chunkName]) { throw new Error( @@ -504,6 +504,14 @@ export class ProdLoader extends BaseLoader { } super(loadComponent, matchPaths) + + if (pageData) { + this.pageDataDb.set(pageData.path, { + pagePath: pageData.path, + payload: pageData, + status: `success`, + }) + } } doPrefetch(pagePath) { diff --git a/packages/gatsby/cache-dir/production-app.js b/packages/gatsby/cache-dir/production-app.js index 47de0c5941894..5633e5863a706 100644 --- a/packages/gatsby/cache-dir/production-app.js +++ b/packages/gatsby/cache-dir/production-app.js @@ -25,7 +25,7 @@ import stripPrefix from "./strip-prefix" // Generated during bootstrap import matchPaths from "$virtual/match-paths.json" -const loader = new ProdLoader(asyncRequires, matchPaths) +const loader = new ProdLoader(asyncRequires, matchPaths, window.pageData) setLoader(loader) loader.setApiRunner(apiRunner) diff --git a/packages/gatsby/cache-dir/static-entry.js b/packages/gatsby/cache-dir/static-entry.js index a6ca77e440270..4d25353cc9382 100644 --- a/packages/gatsby/cache-dir/static-entry.js +++ b/packages/gatsby/cache-dir/static-entry.js @@ -110,6 +110,7 @@ export default async function staticPage({ scripts, reversedStyles, reversedScripts, + inlinePageData = false, }) { // for this to work we need this function to be sync or at least ensure there is single execution of it at a time global.unsafeBuiltinUsage = [] @@ -330,7 +331,7 @@ export default async function staticPage({ ) }) - if (pageData) { + if (pageData && !inlinePageData) { headComponents.push( */` + const windowPageData = `/**/` postBodyComponents.push(