search

ForbesLindesay / browserify-middleware

express middleware for browserify, done right
http://browserify.org
MIT License
381 stars 66 forks source link

Converting DOM Element References as Global Variables #28

Closed gagan-bansal closed 10 years ago

gagan-bansal commented 10 years ago

When I use browserify-middleware all DOM elements references are getting converted to global variables. If a div id is 'mydiv' that can be accessed as window.mydiv.

"DOM Element References as Global Variables" is part of html specification (http://tjvantoll.com/2012/07/19/dom-element-references-as-global-variables/).

But if I don't use browserify-middleware then elements ids are not mapped as global variables. So is there any solution so that we can avoid this mapping at browser.

Gagan

ForbesLindesay commented 10 years ago

I think I can say with some considerable confidence that this is not caused by browserify-middleware. browserify-middleware is not the thing that is causing ids to be mapped or not mapped as global variables. If you believe otherwise, please produce a test case to demonstrate it.

gagan-bansal commented 10 years ago

Yes I might be doing something wrong, as I am new to node.js environment.

In browserify-middleware example itself, I added a div in index.html like this:

<!DOCTYPE html>
<html>
  <head>
    <script src="/js/entry-a.js"></script>
    <script src="/js/entry-b.js"></script>
    <script src="/js/file.js"></script>
    <script src="/js/bundle.js"></script>
    <script src="/non-browserify.js"></script>
  </head>
  <body>
    Open the console to view results.
    <div id='mydiv'>mydiv Test</div>
    <script>alert(mydiv);</script>
  </body>
</html>

After starting the server.js I get the alert ([object HTMLDivElement]]. Please suggest what could be the issue.

ForbesLindesay commented 10 years ago

Yes, consider the following html file:

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <div id='mydiv'>mydiv Test</div>
    <script>alert(mydiv);</script>
  </body>
</html>

You can open that directly in your browser (with no browserify stuff attached) and get exactly the same result.

See the article you linked for the reasoning behind this. Sadly, it will always be true that browsers have this feature, because it's now been standardized. You should however just ignore it and use docyment.getElementById('mydiv') instead.

gagan-bansal commented 10 years ago

Oh yes, feeling embarrassed on such a silly issue. Sorry for bothering you.

Thanks for your time. Gagan