ReferenceError: self is not defined

[BorisZubchenko]

Bug report

Packages affected

• nodebox

Description of the problem

I can't make the simplest example work with Next.js and Nodebox.

What were you doing when the problem occurred?

What steps can we take to reproduce the problem?

1. Create a Next.js app.
2. Install nodebox
3. Go to page.tsx
4. Replace the content with:

'use client'

import { Nodebox } from '@codesandbox/nodebox'
import { useEffect, useRef } from 'react'

export default function Home() {
  const iframeRef = useRef<HTMLIFrameElement>(null)

  useEffect(() => {
    const thisEffect = async () => {
      if (!iframeRef.current) {
        return
      }

      const emulator = new Nodebox({
        iframe: iframeRef.current,
      })

      await emulator.connect()
    }

    thisEffect()
  })

  return (
    <div>
      <iframe
        id="nodebox-runtime-iframe"
        ref={iframeRef}
      />
    </div>
  )
}

5. Get the following error (server):

 X node_modules/@codesandbox/nodebox/build/index.mjs (64:0) @ ../../node_modules/.pnpm/cuid@2.1.8/node_modules/cuid/lib/fingerprint.browser.js
 X ReferenceError: self is not defined
    at __webpack_require__ (/home/projects/stackblitz-starters-nxgtxn/.next/server/webpack-runtime.js:33:42)
    at eval (./app/page.tsx:7:78)
    at (ssr)/./app/page.tsx (/home/projects/stackblitz-starters-nxgtxn/.next/server/app/page.js:151:1)
    at __webpack_require__ (/home/projects/stackblitz-starters-nxgtxn/.next/server/webpack-runtime.js:33:42)
null

Link to sandbox: link

Your Environment

Software	Name/Version
nodebox version	0.1.9
Browser	N/A
Operating System	N/A