ReferenceError: window is not defined, server rendering.

[jay-sridharan]

Environment

• OS: Windows 10
• Node: 6.5.0
• NPM: 3.10.3
• react-advanaced-form: 1.5.7

What

Current behavior

Please describe how it behaves at the moment.

C:\Users\Jayasurya\Documents\GitHub\InventorySystem\node_modules\react-advanced-form\lib\index.production.js:1
(function (exports, require, module, __filename, __dirname) { !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define("reactAdvancedForm",["react"],t):"object"==typeof exports?exports.reactAdvancedForm=t(require("react")):e.reactAdvancedForm=t(e.react)}(window,function(e){return function(e){var t={};function r(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object

ReferenceError: window is not defined
    at Object.<anonymous> (C:\Users\Jayasurya\Documents\GitHub\InventorySystem\node_modules\react-advanced-form\lib\index.production.js:1:282)
    at Module._compile (module.js:556:32)
    at Module._extensions..js (module.js:565:10)
    at Object.require.extensions.(anonymous function) [as .js] (C:\Users\Jayasurya\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-register\lib\node.js:152:7)
    at Module.load (module.js:473:32)
    at tryModuleLoad (module.js:432:12)
    at Function.Module._load (module.js:424:3)
    at Module.require (module.js:483:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (C:\Users\Jayasurya\Documents\GitHub\InventorySystem\node_modules\react-advanced-form\index.js:6:20)

Expected behavior

The library should not depend on the window object anywhere, or check if it exists before usage to allow server rendering to occur.

Why

Why do you think the issue occurs?

The library depends on the existence of window somewhere.

How

Steps to reproduce the issue (ideally, link to the repository/sandbox).

Import any React component that uses a react-advanced-form component into a server file, and this error should occur.

[kettanaito]

Hi, @jayasurya-sridharan. Thanks for reporting the issue.

I have two reasons why this might have happened:

1. Broken bundling. Maybe the exported bundle writes the module into the window (umd modules may do that).
2. Dependency issue. There may be a dependency that relies on the window object.

It would be helpful if you could import a development version of the library in your server (library version inherits from NODE_ENV). This way it would contain more detailed error stack trace.

I will try to look into this issue as soon as I have time.

[kettanaito]

This looks like a webpack issue (webpack/webpack#6522) when performing an umd build. It looks like it uses explicit window instead of this.

Following the thread further, I have found a fix to enforce proper this reference during the build. Building the library now doesn't include any reference to the window. I would need to also test it by performing a server build that includes react-advanced-form.

[kettanaito]

@jayasurya-sridharan The fix is published under 1.5.8.

Please update to the mentioned patch version and server builds should works properly. Let me know in this thread if you have any issues. Thanks.