Javascriptservices: Angular Template: EXCEPTION: Uncaught (in promise): ReferenceError: window is not defined

Created on 19 Sep 2016  路  15Comments  路  Source: aspnet/JavaScriptServices

After updating all files to newest template I receive this stack trace in server console:

fail: Microsoft.AspNetCore.NodeServices[0]
EXCEPTION: Uncaught (in promise): ReferenceError: window is not defined
fail: Microsoft.AspNetCore.NodeServices[0]
ORIGINAL STACKTRACE:
fail: Microsoft.AspNetCore.NodeServices[0]
Error: Uncaught (in promise): ReferenceError: window is not defined
at resolvePromise (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:418:31)
at C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:454:17
at ZoneDelegate.invokeTask (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:225:37)
at Object.NgZoneImpl.inner.inner.fork.onInvokeTask (C:\Users\hexbo\Documents\cx_public\node_modules\@angular\core\bundles\core.umd.js:6233:41)
at ZoneDelegate.invokeTask (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:224:42)
at Zone.runTask (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:125:47)
at drainMicroTaskQueue (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:357:35)
at runMicrotasksCallback (internal/process/next_tick.js:58:5)
at _combinedTickCallback (internal/process/next_tick.js:67:7)
at process._tickDomainCallback (internal/process/next_tick.js:122:9)
fail: Microsoft.AspNetCore.NodeServices[0]
Unhandled Promise rejection: window is not defined ; Zone: angular ; Task: Promise.then ; Value: ReferenceError: window is not defined
at SafeSubscriber._next (C:\Users\hexbo\Documents\cx_public\ClientApp\boot-server.js:6:27799)
at SafeSubscriber.__tryOrUnsub (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:223:16)
at SafeSubscriber.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:172:22)
at Subscriber._next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:125:26)
at Subscriber.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:89:18)
at Subject.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subject.js:55:25)
at resolveData$.forEach.then._this.navigated (C:\Users\hexbo\Documents\cx_public\node_modules\@angular\router\bundles\router.umd.js:2650:44)
at ZoneDelegate.invoke (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:192:28)
at Object.NgZoneImpl.inner.inner.fork.onInvoke (C:\Users\hexbo\Documents\cx_public\node_modules\@angular\core\bundles\core.umd.js:6242:41)
at ZoneDelegate.invoke (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:191:34) ReferenceError: window is not defined
at SafeSubscriber._next (C:\Users\hexbo\Documents\cx_public\ClientApp\boot-server.js:6:27799)
at SafeSubscriber.__tryOrUnsub (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:223:16)
at SafeSubscriber.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:172:22)
at Subscriber._next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:125:26)
at Subscriber.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:89:18)
at Subject.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subject.js:55:25)
at resolveData$.forEach.then._this.navigated (C:\Users\hexbo\Documents\cx_public\node_modules\@angular\router\bundles\router.umd.js:2650:44)
at ZoneDelegate.invoke (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:192:28)
at Object.NgZoneImpl.inner.inner.fork.onInvoke (C:\Users\hexbo\Documents\cx_public\node_modules\@angular\core\bundles\core.umd.js:6242:41)
at ZoneDelegate.invoke (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:191:34)
fail: Microsoft.AspNetCore.NodeServices[0]
{ Error: Uncaught (in promise): ReferenceError: window is not defined
at resolvePromise (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:418:31)
at C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:454:17
at ZoneDelegate.invokeTask (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:225:37)
at Object.NgZoneImpl.inner.inner.fork.onInvokeTask (C:\Users\hexbo\Documents\cx_public\node_modules\@angular\core\bundles\core.umd.js:6233:41)
at ZoneDelegate.invokeTask (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:224:42)
at Zone.runTask (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:125:47)
at drainMicroTaskQueue (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:357:35)
at runMicrotasksCallback (internal/process/next_tick.js:58:5)
at _combinedTickCallback (internal/process/next_tick.js:67:7)
at process._tickDomainCallback (internal/process/next_tick.js:122:9)
fail: Microsoft.AspNetCore.NodeServices[0]

    rejection:
     ReferenceError: window is not defined
         at SafeSubscriber._next (C:\Users\hexbo\Documents\cx_public\ClientApp\boot-server.js:6:27799)
         at SafeSubscriber.__tryOrUnsub (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:223:16)
         at SafeSubscriber.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:172:22)
         at Subscriber._next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:125:26)
         at Subscriber.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:89:18)
         at Subject.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subject.js:55:25)
         at resolveData$.forEach.then._this.navigated (C:\Users\hexbo\Documents\cx_public\node_modules\@angular\router\bundles\router.umd.js:2650:44)
         at ZoneDelegate.invoke (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:192:28)
         at Object.NgZoneImpl.inner.inner.fork.onInvoke (C:\Users\hexbo\Documents\cx_public\node_modules\@angular\core\bundles\core.umd.js:6242:41)
         at ZoneDelegate.invoke (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:191:34),

fail: Microsoft.AspNetCore.NodeServices[0]

    promise:
     ZoneAwarePromise {

fail: Microsoft.AspNetCore.NodeServices[0]

       __zone_symbol__state: 0,

fail: Microsoft.AspNetCore.NodeServices[0]

       __zone_symbol__value:
        ReferenceError: window is not defined
            at SafeSubscriber._next (C:\Users\hexbo\Documents\cx_public\ClientApp\boot-server.js:6:27799)
            at SafeSubscriber.__tryOrUnsub (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:223:16)
            at SafeSubscriber.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:172:22)
            at Subscriber._next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:125:26)
            at Subscriber.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subscriber.js:89:18)
            at Subject.next (C:\Users\hexbo\Documents\cx_public\node_modules\rxjs\Subject.js:55:25)
            at resolveData$.forEach.then._this.navigated (C:\Users\hexbo\Documents\cx_public\node_modules\@angular\router\bundles\router.umd.js:2650:44)
            at ZoneDelegate.invoke (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:192:28)
            at Object.NgZoneImpl.inner.inner.fork.onInvoke (C:\Users\hexbo\Documents\cx_public\node_modules\@angular\core\bundles\core.umd.js:6242:41)
            at ZoneDelegate.invoke (C:\Users\hexbo\Documents\cx_public\node_modules\zone.js\dist\zone-node.js:191:34) },

fail: Microsoft.AspNetCore.NodeServices[0]

    zone:
     Zone {

fail: Microsoft.AspNetCore.NodeServices[0]

       _properties: { isAngularZone: true },

fail: Microsoft.AspNetCore.NodeServices[0]

       _parent:
        Zone {

fail: Microsoft.AspNetCore.NodeServices[0]

          _properties: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _parent: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _name: 'angular-universal request',

fail: Microsoft.AspNetCore.NodeServices[0]

          _zoneDelegate: [Object] },

fail: Microsoft.AspNetCore.NodeServices[0]

       _name: 'angular',

fail: Microsoft.AspNetCore.NodeServices[0]

       _zoneDelegate:
        ZoneDelegate {

fail: Microsoft.AspNetCore.NodeServices[0]

          _taskCounts: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          zone: [Circular],

fail: Microsoft.AspNetCore.NodeServices[0]

          _parentDelegate: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _forkZS: null,

fail: Microsoft.AspNetCore.NodeServices[0]

          _forkDlgt: null,

fail: Microsoft.AspNetCore.NodeServices[0]

          _interceptZS: null,

fail: Microsoft.AspNetCore.NodeServices[0]

          _interceptDlgt: null,

fail: Microsoft.AspNetCore.NodeServices[0]

          _invokeZS: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _invokeDlgt: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _handleErrorZS: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _handleErrorDlgt: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _scheduleTaskZS: null,

fail: Microsoft.AspNetCore.NodeServices[0]

          _scheduleTaskDlgt: null,

fail: Microsoft.AspNetCore.NodeServices[0]

          _invokeTaskZS: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _invokeTaskDlgt: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _cancelTaskZS: null,

fail: Microsoft.AspNetCore.NodeServices[0]

          _cancelTaskDlgt: null,

fail: Microsoft.AspNetCore.NodeServices[0]

          _hasTaskZS: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _hasTaskDlgt: [Object] } },

fail: Microsoft.AspNetCore.NodeServices[0]

    task:
     ZoneTask {

fail: Microsoft.AspNetCore.NodeServices[0]

       runCount: 1,

fail: Microsoft.AspNetCore.NodeServices[0]

       type: 'microTask',

fail: Microsoft.AspNetCore.NodeServices[0]

       zone:
        Zone {

fail: Microsoft.AspNetCore.NodeServices[0]

          _properties: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _parent: [Object],

fail: Microsoft.AspNetCore.NodeServices[0]

          _name: 'angular',

fail: Microsoft.AspNetCore.NodeServices[0]

          _zoneDelegate: [Object] },

fail: Microsoft.AspNetCore.NodeServices[0]

       source: 'Promise.then',

fail: Microsoft.AspNetCore.NodeServices[0]

       data: undefined,

fail: Microsoft.AspNetCore.NodeServices[0]

       scheduleFn: undefined,

fail: Microsoft.AspNetCore.NodeServices[0]

       cancelFn: null,

fail: Microsoft.AspNetCore.NodeServices[0]

       callback: [Function],

fail: Microsoft.AspNetCore.NodeServices[0]

       invoke: [Function] } }
picture hheexx

Most helpful comment

angular2-universal

picture hheexx on 22 Feb 2017
👍2

All 15 comments

Unfortunately window isn't available on the server, if you need to access it either use isBrowser flags to use it in specific scenarios, or use it only in your boot-client somewhere.

If it's further along in your App, you'll want to do something like:

if (isBrowser) {
    // window.whatever here
}

We're working on at mocking/fixing certain things such as window so that in the future this is just easier to deal with on the server-side.

MarkPieszak picture MarkPieszak on 20 Sep 2016

@MarkPieszak is correct, but can I also clarify with @hheexx: are you saying that the _same application code_ used to work without errors before you updated to the newer template?

If so, could you post more information about where your code is accessing window? I don't understand how that could have worked on the server even before updating the template. Do you have any repro steps (as in, a snippet of code we can add to the template) that would enable us to see the problem occurring, in some way that didn't occur before updating the template?

SteveSandersonMS picture SteveSandersonMS on 20 Sep 2016

No, my code does not access the window, that is a problem :)

I use identical boot-server.ts from template.

As you can see whole stack is in zone-node.js so I don't understand what part of code may be responsible. I'm not that good with angular2 troubleshooting yet.

Also, where I can find transpiled js files on server?
How can I know what line of code in TS is responsible when stack trace is in JS?

hheexx picture hheexx on 20 Sep 2016
👍1

@hheexx Did you wipe your node_modules folder and try reinstalling again?
Are you using npm3.*+?

MarkPieszak picture MarkPieszak on 20 Sep 2016

yes, multiple times.

Node 6.4.0
NPM 3.10.7

hheexx picture hheexx on 20 Sep 2016

Does this call stack mean anything to you?

hheexx picture hheexx on 20 Sep 2016

Is this a completely default new Repo or do you have code in there? ( Lazy-loading routes or anything new and specific that might be causing it) I'm looking into it!

MarkPieszak picture MarkPieszak on 20 Sep 2016

It has 10-20 components but all are without js for now, just HTML.
It had angular2-google-maps component that executed only on client but I completly disabled it.

hheexx picture hheexx on 20 Sep 2016

I'm afraid I don't know based on the call stack alone. Can you supply details on how to repro the issue starting from a new project?

SteveSandersonMS picture SteveSandersonMS on 20 Sep 2016

Ok, my bad. I just found piece of code that breaks and it's mine.
But it worked with @MarkPieszak 's version and it was broken by your refactoring.

Code is in App component and it scrolls to top of page on view change:

router.events.subscribe(s => {
if (s instanceof NavigationEnd) {
window.scrollTo(0, 0);
}
});

Now i wrapped it with if (IsBrowser) {..} and it works great but have in mind that this observable was not triggered before on the server and now it does. Don't know why.

Please close the bug if you think that this behavior change does not need fixing...

hheexx picture hheexx on 20 Sep 2016

have in mind that this observable was not triggered before on the server and now it does

I can only guess this is to do with you now running on Angular 2 final, which is quite different internally than Angular 2 RC4. Besides that major change, these templates work the same at runtime as they did before :)

SteveSandersonMS picture SteveSandersonMS on 20 Sep 2016

Nope.
It worked with @MarkPieszak patch to angular final before your's refactoring.

hheexx picture hheexx on 20 Sep 2016

Ah OK, thanks for clarifying. I don't know why changing the file layout in the way I did would have this effect.

SteveSandersonMS picture SteveSandersonMS on 20 Sep 2016

isBrowser??? What module should I import to use this?

pavlalexandr picture pavlalexandr on 22 Feb 2017

angular2-universal

hheexx picture hheexx on 22 Feb 2017
👍2
Was this page helpful?
0 / 5 - 0 ratings

Related issues

justinyoo picture justinyoo  路  3Comments
AmrineA picture AmrineA  路  3Comments
Eilon picture Eilon  路  3Comments
natemcmaster picture natemcmaster  路  4Comments
ZeekoZhu picture ZeekoZhu  路  3Comments