nickschot / ember-mobile-menu

A draggable sidebar menu for Ember
https://nickschot.github.io/ember-mobile-menu
MIT License
34 stars 9 forks source link

Getting window.addEventListener is not a function TypeError in FastBoot #186

Open Samuel-Torres opened 2 years ago

Samuel-Torres commented 2 years ago

I'm getting the following error when running in fastboot.

My Error:

window.addEventListener is not a function
TypeError: window.addEventListener is not a function
    at eval (webpack://__ember_auto_import__/../node_modules/body-scroll-lock/lib/bodyScrollLock.esm.js?:30:10)
    at Module.../node_modules/body-scroll-lock/lib/bodyScrollLock.esm.js (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/vendor.js:130247:1)
    at __webpack_require__ (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/vendor.js:130089:30)
    at Module.eval [as callback] (webpack://__ember_auto_import__//private/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/cache-732-bundler/staging/app.js?:22:51)
    at Module.exports (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/vendor/loader/loader.js:106:1)
    at Module._reify (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/vendor/loader/loader.js:143:1)
    at Module.reify (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/vendor/loader/loader.js:130:1)
    at Module.exports (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/vendor/loader/loader.js:104:1)
    at Module._reify (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/vendor/loader/loader.js:143:1)
    at Module.reify (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/vendor/loader/loader.js:130:1)
    at Module.exports (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/vendor/loader/loader.js:104:1)
    at requireModule (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/vendor/loader/loader.js:27:1)
    at Class._extractDefaultExport (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/addon-tree-output/ember-resolver/resolvers/classic/index.js:463:1)
    at Class.resolveOther (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/addon-tree-output/ember-resolver/resolvers/classic/index.js:123:1)
    at Class.resolve (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/addon-tree-output/ember-resolver/resolvers/classic/index.js:186:1)
    at resolve (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/container/index.js:1197:34)
    at Registry.resolve (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/container/index.js:744:19)
    at Registry.resolve (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/container/index.js:747:31)
    at factoryFor (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/container/index.js:296:36)
    at Container.factoryFor (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/container/index.js:215:12)
    at Class.factoryFor (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/runtime/lib/mixins/container_proxy.js:126:31)
    at componentFor (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8074:16)
    at lookupComponentPair (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8083:19)
    at lookupComponent (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8120:10)
    at RuntimeResolver._lookupComponentDefinition (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8411:16)
    at RuntimeResolver.lookupComponentHandle (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8233:35)
    at CompileTimeResolver.lookupComponent (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:2564:42)
    at DefaultCompileTimeResolverDelegate.lookupComponent (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/opcode-compiler.js:122:34)
    at resolveLayoutForTag (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/opcode-compiler.js:165:28)
    at IfResolvedComponent (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/opcode-compiler.js:838:19)
    at compileOp (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/opcode-compiler.js:743:14)
    at pushCompileOp (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/opcode-compiler.js:705:29)
    at concatStatements (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/opcode-compiler.js:1349:7)
    at compileStatements (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/opcode-compiler.js:2050:5)
    at maybeCompile (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/opcode-compiler.js:2039:16)
    at CompilableTemplateImpl.compile (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/opcode-compiler.js:2019:12)
    at JitVM.compile (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/runtime.js:5866:37)
    at Object.evaluate (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/runtime.js:2645:19)
    at AppendOpcodes.evaluate (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/runtime.js:1953:17)
    at LowLevelVM.evaluateSyscall (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/runtime.js:4856:20)
    at LowLevelVM.evaluateInner (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/runtime.js:4812:12)
    at LowLevelVM.evaluateOuter (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/runtime.js:4804:12)
    at JitVM.next (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/runtime.js:5751:22)
    at TemplateIteratorImpl.next (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/runtime.js:5878:20)
    at RootState.render (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8594:35)
    at runInAutotrackingTransaction (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/validator.js:74:7)
    at /var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8886:13
    at inTransaction (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@glimmer/runtime.js:1908:7)
    at InertRenderer._renderRoots (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8862:7)
    at InertRenderer._renderRootsTransaction (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8921:12)
    at InertRenderer._renderRoot (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8849:10)
    at InertRenderer._appendDefinition (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8764:10)
    at InertRenderer.appendOutletView (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/@ember/-internals/glimmer/index.js:8750:10)
    at invokeWithOnError (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/backburner.js:275:24)
    at Queue.flush (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/backburner.js:182:21)
    at DeferredActionQueues.flush (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/backburner.js:341:27)
    at Backburner._end (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/backburner.js:785:38)
    at Backburner._boundAutorunEnd (/var/folders/95/z8nqp5t559g3g25s412gjft00000gn/T/broccoli-84775T52kzy8gpBPQ/out-733-append_ember_auto_import_analyzer/assets/backburner.js:516:18)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)

I think the following block within this file needs to be gated to only run in the browser and not in fastboot.

@action
  toggleBodyScroll(target, [isClosed]) {
    if (this.args.preventScroll && !this.args.embed) {
      if (isClosed) {
        enableBodyScroll(target);
      } else {
        disableBodyScroll(target);
      }
    }

I think the root of this issue is in this line from body-scroll-lock.

jamemackson commented 2 years ago

@nickschot, I was talking with @Samuel-Torres about collaborating on a PR to resolve this, would you think adding fastboot as an optional dependency would be the right way to approach this since obvs not everyone is going to be using fastboot with this addon? I know yarn supports optional dependencies but I'm also wondering if ember has any mechanism to maybe inject a service if it's present 😬

nickschot commented 2 years ago

We already have a fastboot detection mechanism on the mobile-menu-wrapper component class! I never got the fastboot addon tests working properly (see https://github.com/nickschot/ember-mobile-menu/pull/13 ), which is probably how this incompatibility/bug snuck through... the easy fix here would be to add a check to https://github.com/nickschot/ember-mobile-menu/blob/master/addon/components/mobile-menu-wrapper.js#L97 this line so that it always returns false when in a fastboot environment. The isFastBoot getter is at the top of the class.

Ideally we'd also get the fastboot tests working of course... so that this won't happen again.

nickschot commented 2 years ago

From my local tests we should now be able to go from https://github.com/nickschot/ember-mobile-menu/pull/187 and that should fix this.