Slice previews always error
This didn't start happening until earlier today. Previews looked fine this morning. Here's a video where you can see the slice preview erroring despite the simulator working. Site is fine with no errors even on a vercel deploy (I like to start debugging issues early and often).
https://jam.dev/c/5a8d1f63-6d35-486b-8a28-f2ec35cd9c48
As best I can figure this started when I built a [...slug] route to organize pages into URL routes for better taxonomy organization.
This could be a total red herring but it's one of two major changes I've made.
const routes: prismic.ClientConfig["routes"] = [
{
type: "home",
path: "/",
},
{
type: "route",
path: "/:uid", // This will handle sections like /about, /services, etc.
},
{
type: "page",
resolvers: {
route: "url_route", // Resolving the section relationship
},
path: "/:route/:uid", // This will generate URLs like /about/mission
},
];
Change number 2 affected my next.config.mjs, which has several caveats to keep Vercel happy
/** @type {import('next').NextConfig} */
const nextConfig = {
async headers() {
const headers = [
{
source: '/(.*)',
headers: [
{
key: 'Strict-Transport-Security',
value: 'max-age=63072000; includeSubDomains; preload'
},
{
key: 'X-Content-Type-Options',
value: 'nosniff'
},
{
key: 'X-XSS-Protection',
value: '1; mode=block'
},
{
key: 'Last-Modified',
value: '${next-head-other-last-modified}',
},
],
},
];
// Only add X-Frame-Options header in production and not in preview
if (process.env.NODE_ENV === 'production' && process.env.NEXT_PUBLIC_VERCEL_ENV !== 'preview') {
headers[0].headers.push({
key: 'X-Frame-Options',
value: 'SAMEORIGIN'
});
}
return headers;
},
// ... other configurations
};
export default nextConfig;
This avoids the flag in Chrome that your builder also throws at me. I removed the warning because I'm a completionist but it does deal in cross-origin API calls. I found I had to add the production caveat on the end because those defs were totally blocking slice machine from loading. This was fixed though.
Impacted feature
I can't launch this to the client in a few weeks without finding and squashing the bug
What steps have you taken to resolve this issue already?
Everything but a commit rollback to the last good configuration
Errors
None that I can see - Slicemachine isn't exactly verbose
Your Role
Agency founder and design polymath
Hosting provider
Vercel / Localhost
Package.json file
{
"name": "pocma",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint",
"slicemachine": "start-slicemachine",
"lint:css": "stylelint '**/*.css' --custom-syntax postcss-scss",
"format": "prettier --write \"**/*.{js,jsx,ts,tsx,css,md}\""
},
"dependencies": {
"@amplitude/analytics-browser": "^2.11.3",
"@descope/react-sdk": "^2.0.74",
"@prismicio/client": "^7.8.1",
"@prismicio/helpers": "^2.3.9",
"@prismicio/next": "^1.6.0",
"@prismicio/react": "^2.8.0",
"@prismicio/types": "^0.2.9",
"@supabase/auth-helpers-nextjs": "^0.10.0",
"@supabase/auth-helpers-react": "^0.5.0",
"@supabase/ssr": "^0.5.1",
"@supabase/supabase-js": "^2.45.4",
"clsx": "^2.1.1",
"next": "14.2.10",
"react": "^18",
"react-dom": "^18"
},
"devDependencies": {
"@slicemachine/adapter-next": "^0.3.49",
"@types/node": "^20",
"@types/react": "^18",
"@types/react-dom": "^18",
"eslint": "^8",
"eslint-config-next": "14.2.10",
"eslint-plugin-tailwindcss": "^3.14.3",
"husky": "^9.1.6",
"lint-staged": "^15.2.10",
"postcss": "^8",
"postcss-scss": "^4.0.9",
"prettier": "^3.3.3",
"prettier-plugin-tailwindcss": "^0.6.6",
"schema-dts": "^1.1.2",
"slice-machine-ui": "^2.7.1",
"stylelint": "^16.9.0",
"stylelint-config-standard": "^36.0.1",
"tailwindcss": "^3.4.1",
"typescript": "^5"
},
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.{js,jsx,ts,tsx,css,md}": "prettier --write"
}
}
Steps to reproduce
If I knew the answer to this I'd be reporting a defect not asking for help 
