Getting production issue! ReferenceError self is not defined

@chungwu Issue in productIon!

I am suddenly getting this error:

ERROR:  ReferenceError: self is not defined
  at eval (eval at load (/var/app/current/node_modules/@plasmicapp/loader-core/dist/loader-core.cjs.development.js:300:16), <anonymous>:4:3729)
  at eval (eval at load (/var/app/current/node_modules/@plasmicapp/loader-core/dist/loader-core.cjs.development.js:300:16), <anonymous>:4:1849)
  at eval (eval at load (/var/app/current/node_modules/@plasmicapp/loader-core/dist/loader-core.cjs.development.js:300:16), <anonymous>:4:15881)
  at Registry.load (/var/app/current/node_modules/@plasmicapp/loader-core/dist/loader-core.cjs.development.js:303:5)
  at requireFn (/var/app/current/node_modules/@plasmicapp/loader-core/dist/loader-core.cjs.development.js:290:22)
  at eval (eval at load (/var/app/current/node_modules/@plasmicapp/loader-core/dist/loader-core.cjs.development.js:300:16), <anonymous>:4:608)
  at Registry.load (/var/app/current/node_modules/@plasmicapp/loader-core/dist/loader-core.cjs.development.js:303:5)
  at requireFn (/var/app/current/node_modules/@plasmicapp/loader-core/dist/loader-core.cjs.development.js:290:22)
  at eval (eval at load (/var/app/current/node_modules/@plasmicapp/loader-core/dist/loader-core.cjs.development.js:300:16), <anonymous>:4:616)
  at Registry.load (/var/app/current/node_modules/@plasmicapp/loader-core/dist/loader-core.cjs.development.js:303:5)

I looked at that code… Screenshot below, and it looks like this is where you are loading JSX code for our page… Did anything get messed up recently with how code is generated for pages?

image.png

can I see this in production?

@chungwu we are doing this on the backend thankfully, and rendering to an intermediary cache, so customers are not seeing this, but this is preventing us from updating any pages

what’s the project id?

project: https://studio.plasmic.app/projects/k5wi36LTCNmnJb5rh2sgis

@chungwu have you been able to identify / recreate?

do you know which page is throwing the error?

Looks like it is: /pages/2022-holiday-gift-guide

Yep, fails on this in both production and staging

IP: 2022 Holiday Gift Guide

hmm I haven’t been able to reproduce locally yet

this is happening during server rendering?

The only thing that changed is that we are now passing ‘skipFonts’

export const PLASMIC = initPlasmicLoader({
  projects: [
    {
      id: meta.projectId,
      token: ''            //API token should not be necessary, as we are not fetching anything.. See BUG note above
    }
  ],
  // Fetches the latest revisions, whether or not they were unpublished!
  // Disable for production to ensure you render only published changes.
  preview: false,
  // Don't load default fonts.. We have our own fonts loaded through react code
  // (and on-site in shopify code)
  skipFonts: true,
});

yep, it is during server side rendering…

/**
 * Copyright (C) 2017-2022 Sips by - All Rights Reserved
 * Unauthorized copying of this file, via any medium is strictly prohibited
 * Proprietary and confidential
 * ~
 **/
import React from 'react';
import { register, PlasmicRootProvider, PlasmicComponent, initPlasmicLoader } from 'assets/plasmic/components-landingpage.js';

//Should be 100% match with exports from contentful/v1/components.js

/* The below is defining the const variables: urlCdn, urlSipsbyShopify, urlSipsbyM for use in templates */
<!-- INJECT VARS -->

const pageData = (/* SIPSBY JSON TEMPLATE BEGIN *//* SIPSBY JSON TEMPLATE END */);
const meta = pageData.entryCompMetas[0];

//BUG: As of 2022-03-26, a loader is required even though we are passing in data
export const PLASMIC = initPlasmicLoader({
  projects: [
    {
      id: meta.projectId,
      token: ''            //API token should not be necessary, as we are not fetching anything.. See BUG note above
    }
  ],
  // Fetches the latest revisions, whether or not they were unpublished!
  // Disable for production to ensure you render only published changes.
  preview: false,
  // Don't load default fonts.. We have our own fonts loaded through react code
  // (and on-site in shopify code)
  skipFonts: true,
});

//Register landing page components
register(PLASMIC);

//BUG: As of 2022-03-26, plasmic puts web-rendered components in the pageData.bundle.modules.browser. When rendering on server-side these
//     need to be in *.server. Move the components over, but also make sure to not break if they fix this
pageData.bundle.modules.server = [...pageData.bundle.modules.server, ...pageData.bundle.modules.browser];


export const Content = () => (
  <PlasmicRootProvider prefetchedData={pageData} loader={PLASMIC}>
    <PlasmicComponent projectId={meta.projectId} component={meta.path} />
  </PlasmicRootProvider>
);

we inject code into the TEMPLATE BEGIN / END section

The only thing that has changed here is the added ‘skipFonts’ …

However we have run on staging with skipFonts, and it was working there…

@chungwu… just realizing that I am providing skipFonts to the wrong component… I am providing it to initPlasmicLoader … I will add it to PlasmicRootProvider instead and see if that changs anything…

Erorr message is still very weird if that is the case though…

which node version are you using?

@chungwu I should be using 16