Unhandled Runtime Error on fresh install #6650

sagerio · 2021-09-24T19:28:42Z

Bug report

Hi,
I wanted to give KeystoneJS a try and installed v6 as in the docs described.
On opening http://localhost:3000 with either browser, it throws an unhandled exception.
I removed everything and tried it a second time with different names etc, but same result.

To Reproduce

yarn create keystone-app
success Installed "[email protected]" with binaries:
- create-keystone-app
...
⠧ Installing dependencies with yarn. This may take a few minutes
...
Keystone created a starter project in: keystone-test
...
cd keystone-test
yarn dev
(calling http://localhost:3000/ in browser)

Error message

Unhandled Runtime Error
TypeError: Cannot read properties of undefined (reading 'document')

Call Stack
Module.createFocusTrap
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/pages/_app.js (61799:25)
<unknown>
/_next/static/chunks/pages/_app.js (29159:67)
invokePassiveEffectCreate
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (41577:20)
HTMLUnknownElement.callCallback
/_next/static/chunks/main.js (22040:14)
Object.invokeGuardedCallbackDev
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (22089:16)
invokeGuardedCallback
/_next/static/chunks/main.js (22151:31)
flushPassiveEffectsImpl
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (41664:9)
unstable_runWithPriority
/_next/static/chunks/main.js (48357:12)
runWithPriority$1
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (29371:10)
flushPassiveEffects
/_next/static/chunks/main.js (41537:14)
performSyncWorkOnRoot
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (40359:3)
<unknown>
/_next/static/chunks/main.js (29422:26)
unstable_runWithPriority
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (48357:12)
runWithPriority$1
/_next/static/chunks/main.js (29371:10)
flushSyncCallbackQueueImpl
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (29417:9)
flushSyncCallbackQueue
/_next/static/chunks/main.js (29404:3)
scheduleUpdateOnFiber
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (39983:9)
updateContainer
/_next/static/chunks/main.js (43572:3)
legacyRenderSubtreeIntoContainer
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (44127:5)
Object.render
/_next/static/chunks/main.js (44193:10)
renderReactElement
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (8709:28)
doRender
/_next/static/chunks/main.js (8883:3)
_callee2$
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (8576:20)
tryCatch
/_next/static/chunks/main.js (46829:40)
Generator.invoke [as _invoke]
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (47060:22)
Generator.next
/_next/static/chunks/main.js (46885:21)
asyncGeneratorStep
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (8070:24)
_next
/_next/static/chunks/main.js (8092:9)
<unknown>
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (8099:7)
new Promise
<anonymous>
<unknown>
/_next/static/chunks/main.js (8088:12)
render
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (8617:18)
Router.subscription [as sub]
/_next/static/chunks/main.js (8509:24)
Router.notify
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (13696:19)
Router.set
/_next/static/chunks/main.js (13371:19)
Router._callee$
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (13071:29)
tryCatch
/_next/static/chunks/main.js (46829:40)
Generator.invoke [as _invoke]
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (47060:22)
Generator.next
/_next/static/chunks/main.js (46885:21)
asyncGeneratorStep
file:///C:/Repository/keystone-test/.keystone/admin/.next/static/chunks/main.js (16036:24)
_next
/_next/static/chunks/main.js (16058:9)

System information

OS: Windows 10
Browser: Edge Version 93.0.961.52, Firefox 92.0.1
node: 14.15.1

The text was updated successfully, but these errors were encountered:

mdemin914 · 2021-09-24T22:47:11Z

I got the same error today following the getting started guide. After entering the user info.

OS: macOs 11.4
Browser: Chrome 93.0.4577.82
node: 14.17.6

Uncaught TypeError: Cannot read properties of undefined (reading 'document')
    at Module.createFocusTrap (focus-trap.esm.js?fc14:155)
    at eval (popover.esm.js?00b0:152)
    at invokePassiveEffectCreate (react-dom.development.js?a814:23487)
    at HTMLUnknownElement.callCallback (react-dom.development.js?a814:3945)
    at Object.invokeGuardedCallbackDev (react-dom.development.js?a814:3994)
    at invokeGuardedCallback (react-dom.development.js?a814:4056)
    at flushPassiveEffectsImpl (react-dom.development.js?a814:23574)
    at unstable_runWithPriority (scheduler.development.js?e22e:468)
    at runWithPriority$1 (react-dom.development.js?a814:11276)
    at flushPassiveEffects (react-dom.development.js?a814:23447)
    at performSyncWorkOnRoot (react-dom.development.js?a814:22269)
    at eval (react-dom.development.js?a814:11327)
    at unstable_runWithPriority (scheduler.development.js?e22e:468)
    at runWithPriority$1 (react-dom.development.js?a814:11276)
    at flushSyncCallbackQueueImpl (react-dom.development.js?a814:11322)
    at flushSyncCallbackQueue (react-dom.development.js?a814:11309)
    at scheduleUpdateOnFiber (react-dom.development.js?a814:21893)
    at dispatchAction (react-dom.development.js?a814:16139)
    at eval (useBaseQuery.js?f006:19)

adriansalvatori · 2021-09-25T05:57:21Z

Just got exactly the same.

msgadi · 2021-09-25T06:13:52Z

Yes I am also facing same issue. Is there any quick solution to this?

RarogCmex · 2021-09-25T07:09:40Z

I've found potential source of issue. It was a dependency upgrade that broken:

"@types/lodash@^4.14.149":
  version "4.14.173"
  resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.173.tgz#9d3b674c67a26cf673756f6aca7b429f237f91ed"
  integrity sha512-vv0CAYoaEjCw/mLy96GBTnRoZrSxkGE0BKzKimdR8P3OzrNYNvBgtW7p055A+E8C31vXNUhWKoFCbhq7gbyhFg==
  version "4.14.174"
  resolved "https://registry.yarnpkg.com/@types/lodash/-/lodash-4.14.174.tgz#b4b06b6eced9850eed6b6a8f1abdd0f5192803c1"
  integrity sha512-KMBLT6+g9qrGXpDt7ohjWPUD34WA/jasrtjTEHStF0NPdEwJ1N9SZ+4GaMVDeuk/y0+X5j9xFm6mNiXS7UoaLQ==

"@types/long@^4.0.0":
  version "4.0.1"
@@ -1395,9 +1395,9 @@
  integrity sha512-BYOID+l2Aco2nBik+iYS4SZX0Lf20KPILP5RGmM1IgzdwNdTs0eebiFriOPcej1sX9mLnSoiNte5zcFxssgpGA==

"@types/prettier@^2.3.2":
  version "2.3.2"
  resolved "https://registry.yarnpkg.com/@types/prettier/-/prettier-2.3.2.tgz#fc8c2825e4ed2142473b4a81064e6e081463d1b3"
  integrity sha512-eI5Yrz3Qv4KPUa/nSIAi0h+qX0XyewOliug5F2QAtuRg6Kjg6jfmxe1GIwoIRhZspD1A0RP8ANrPwvEXXtRFog==
  version "2.4.0"
  resolved "https://registry.yarnpkg.com/@types/prettier/-/prettier-2.4.0.tgz#900b13362610ccd3570fb6eefb911a6732973d00"
  integrity sha512-WHRsy5nMpjXfU9B0LqOqPT06EI2+8Xv5NERy0pLxJLbU98q7uhcGogQzfX+rXpU7S5mgHsLxHrLCufZcV/P8TQ==

"@types/prompts@^2.0.14":
  version "2.0.14"
@@ -2738,9 +2738,9 @@ [email protected]:
  integrity sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0=

electron-to-chromium@^1.3.723, electron-to-chromium@^1.3.846:
  version "1.3.849"
  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.849.tgz#45a65a392565abc5b864624b9753393336426f4b"
  integrity sha512-RweyW60HPOqIcxoKTGr38Yvtf2aliSUqX8dB3e9geJ0Bno0YLjcOX5F7/DPVloBkJWaPZ7xOM1A0Yme2T1A34w==
  version "1.3.850"
  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.3.850.tgz#c56c72abfeab051b4b328beb894461c5912d0456"
  integrity sha512-ZzkDcdzePeF4dhoGZQT77V2CyJOpwfTZEOg4h0x6R/jQhGt/rIRpbRyVreWLtD7B/WsVxo91URm2WxMKR9JQZA==

elliptic@^6.5.3:
  version "6.5.4"
@@ -3074,9 +3074,9 @@ focus-lock@^0.9.1:
    tslib "^2.0.3"

focus-trap@^6.6.1:
  version "6.6.1"
  resolved "https://registry.yarnpkg.com/focus-trap/-/focus-trap-6.6.1.tgz#761ce2c82ddd72beeb049e968bc8414e25b704aa"
  integrity sha512-x9BWuAeF5UrfWuYKJ3jYrjcVYSYptS9CqtxH5IH7lPlZrMsaugKeAa0HtoZSBZe5DmeTMx2m0qY464ZMzqarzw==
  version "6.7.0"
  resolved "https://registry.yarnpkg.com/focus-trap/-/focus-trap-6.7.0.tgz#9b8660ca7d4c621dae7529e73f30e4e59e4419b4"
  integrity sha512-Srd0gR1sq0gfvXNDWkrrW0DbOBoKA5k0iHLTX03Pg/Y9u9xy2tlu3rSgozecCcH10Qj7CV+6nglv0G3YpQ98VA==
  dependencies:
    tabbable "^5.2.1"

knzy-pro · 2021-09-25T11:08:56Z

Also experiencing the same issue

gilbertlucas46 · 2021-09-25T14:40:14Z

same issue with me

jonathancochran · 2021-09-25T19:41:59Z

To fix, run npm i [email protected]

sagerio · 2021-09-26T15:02:55Z

gives me nearly the same error as before?

Unhandled Runtime Error
TypeError: Cannot read properties of undefined (reading 'document')

Source
.next\static\chunks\pages\_app.js (155:0) @ Module.createFocusTrap

  153 | 
  154 | var createFocusTrap = function createFocusTrap(elements, userOptions) {
> 155 |   var doc = userOptions.document || document;
  156 | 
  157 |   var config = _objectSpread2({
  158 |     returnFocusOnDeactivate: true,
Call Stack
invokePassiveEffectCreate
.next\static\chunks\main.js (23487:0)
Object.invokeGuardedCallbackDev
.next\static\chunks\main.js (3994:0)
flushPassiveEffectsImpl
.next\static\chunks\main.js (23574:0)
runWithPriority$1
.next\static\chunks\main.js (11276:0)
performSyncWorkOnRoot
.next\static\chunks\main.js (22269:0)
unstable_runWithPriority
.next\static\chunks\main.js (468:0)
flushSyncCallbackQueueImpl
.next\static\chunks\main.js (11322:0)
scheduleUpdateOnFiber
.next\static\chunks\main.js (21893:0)
<unknown>
.next\static\chunks\pages\_app.js (19:53)

williamtran29 · 2021-09-26T16:25:22Z

got same problem

timleslie · 2021-09-26T23:13:33Z

tl;dr

The bug here is that the focus-trap version 6.7.0 introduced a breaking change in a minor version.

The short term workaround is to pin your version of this package to 6.6.1.

EDIT: Fixed in #6652 - Will close this issue once this has been released.

EDIT: Upstream issue for reference: focus-trap/focus-trap#525

EDIT: Fixed and released upstream: https://github.com/focus-trap/focus-trap/releases/tag/v6.7.1

Details

We call createFocusTrap here:

https://github.com/keystonejs/keystone/blob/master/design-system/packages/popover/src/Popover.tsx#L205

We don't pass a second argument, so the userOptions argument is undefined.

This PR (focus-trap/focus-trap#504) introduced a change which assumes that userOptions isn't undefined. Because it is undefined for us, we end up with a bug.

We can fix this in our packages by passing an empty object, and I'll ship a fix to do that. It would be nice if the upstream package could fix this, but there's no need for us to rely on that 👍

timleslie · 2021-09-27T01:37:32Z

This has been fixed in version 6.7.1 of focus-trap - https://github.com/focus-trap/focus-trap/releases/tag/v6.7.1

Massive shout-out to the focus-trap maintainer, @stefcameron, for the super-quick response 🙏

JedWatson · 2021-09-27T01:44:18Z

Woah, awesome! Thanks for jumping in on this so quickly everyone and for pushing that patch out @stefcameron 👏

stefcameron · 2021-09-27T01:46:05Z

Glad to help. Sorry for the trouble. 🙂

sagerio · 2021-09-27T06:51:20Z

Thanks to all for the great work! 🚀 👍

timleslie mentioned this issue Sep 26, 2021

Fix bug in focus-trap #6652

Merged

bladey added the issue/community label Sep 26, 2021

timleslie closed this as completed Sep 27, 2021

timleslie mentioned this issue Sep 27, 2021

Upgrade focus-trap #6654

Merged

keystonejs-release-bot mentioned this issue Sep 27, 2021

Version Packages #6483

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Unhandled Runtime Error on fresh install #6650

Unhandled Runtime Error on fresh install #6650

sagerio commented Sep 24, 2021

mdemin914 commented Sep 24, 2021 •

edited

Loading

adriansalvatori commented Sep 25, 2021

msgadi commented Sep 25, 2021

RarogCmex commented Sep 25, 2021

knzy-pro commented Sep 25, 2021

gilbertlucas46 commented Sep 25, 2021

jonathancochran commented Sep 25, 2021

sagerio commented Sep 26, 2021

williamtran29 commented Sep 26, 2021

timleslie commented Sep 26, 2021 •

edited

Loading

timleslie commented Sep 27, 2021

JedWatson commented Sep 27, 2021

stefcameron commented Sep 27, 2021

sagerio commented Sep 27, 2021

Unhandled Runtime Error on fresh install #6650

Unhandled Runtime Error on fresh install #6650

Comments

sagerio commented Sep 24, 2021

Bug report

To Reproduce

Error message

System information

mdemin914 commented Sep 24, 2021 • edited Loading

adriansalvatori commented Sep 25, 2021

msgadi commented Sep 25, 2021

RarogCmex commented Sep 25, 2021

knzy-pro commented Sep 25, 2021

gilbertlucas46 commented Sep 25, 2021

jonathancochran commented Sep 25, 2021

sagerio commented Sep 26, 2021

williamtran29 commented Sep 26, 2021

timleslie commented Sep 26, 2021 • edited Loading

tl;dr

Details

timleslie commented Sep 27, 2021

JedWatson commented Sep 27, 2021

stefcameron commented Sep 27, 2021

sagerio commented Sep 27, 2021

mdemin914 commented Sep 24, 2021 •

edited

Loading

timleslie commented Sep 26, 2021 •

edited

Loading