Skip to content

Variables defined at window object are undefined. #182

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
machacekjan opened this issue May 22, 2015 · 4 comments
Closed

Variables defined at window object are undefined. #182

machacekjan opened this issue May 22, 2015 · 4 comments

Comments

@machacekjan
Copy link

Hi,
I have a problem with web-dev-server command and variables at the window object.
I tried define window.mySampleGlobalVariable and then access it from developer tools and it is undefined.

My sample app looks like this:

app.js

window.mySampleGlobalVariable = 'TEST';
console.log('App is ready');

index.html

<!DOCTYPE HTML>
<html>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Webpack test</title>
    </head>

    <body>
        Webpack test
        <script src="bundle.js"></script>
    </body>

</html>

webpack.config.js

var path = require('path');

module.exports = {
    entry: './app.js',
    output: {
        filename: './bundle.js'
    },
    resolve: {
        extensions: ['', '.js']
    }
};

When I use only webpack command everything is working fine. I'm testing it by typing window.mySampleGlobalVariable in chrome developer tools and it prints TEST as I expected

BUT when I run webpack-dev-server command then my window variable is undefined.
@mcolburn
Copy link

I also have this issue. Would someone please provide a response. Thank you!

@121onto
Copy link

121onto commented Mar 13, 2016

+1

@jvalen
Copy link

jvalen commented May 7, 2016

Hi,

I came across with this problem too. I've found two ways to handle it so far.

  1. webpack-dev-server loads your app in an iframe, by default the console of the developer tools have access to the main context but not the variables inside the iframe (unless you expose them somehow with webpack). You can change the context to point to the iframe and access to that data. I tried with Chrome and Firefox and works perfectly.
  2. The other way is just using webpack-dev-server inline mode. We could run the following command webpack-dev-server --inline and check the result at http://<host>:<port>/<path> avoiding the iframe issue.

@SpaceK33z
Copy link
Member

It is not possible for an iframe to pass through these window variables, so we can't fix this. @jvalen provided excellent workarounds.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
5 participants
@SpaceK33z @mcolburn @machacekjan @jvalen @121onto