problems with requiring modules with "win.loadURL(`data:text/html;charset=utf-8,${html}`)" #8425

serapath · 2017-01-17T21:48:12Z

Electron version: v1.3.5
Operating system: Linux Mint 17

Expected behavior

My electron app should open and in the devtools i would be able to access window.bel

Actual behavior

My electron app opens and in the devtools i see the error message:
Uncaught SyntaxError: Unexpected identifier
which i fixed by adding a semicolon which turned it into:
Uncaught Error: Cannot find module 'bel'

How to reproduce

I'm using the standard electron-quick-start

The only line that is different between a working version of the code and the not working version is:

not working version

var html = `
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Document</title>
  </head>
  <body>
    <h1> Hello Universe :-) </h1>
    <script>
      var bel = require('bel');
      window.bel = bel
    </script>
  </body>
</html>
`
win.loadURL(`data:text/html;charset=utf-8,${html}`)

working version

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Document</title>
  </head>
  <body>
    <h1> Hello Universe :-) </h1>
    <script>
      var bel = require('bel');
      window.bel = bel
    </script>
  </body>
</html>

win.loadURL(`file://${__dirname}/page.html`)

The text was updated successfully, but these errors were encountered:

serapath · 2017-01-17T21:50:25Z

I actually would wish that there would be an additional method, like:

(new BrowserWindow()).loadHTML(...)

Alternative - maybe i can open an http server on the fly and use it to serve a file on localhost - but i guess that would allow a web browser or a different app to listen to that port...

Is there a way to provide HTML without creating a separate html file?

MarshallOfSound · 2017-01-20T13:36:54Z

I'm like 99% sure this is "expected" in a sense. Whenever you use require it scans the current directory and then recursively each directory until you reach the root of the current file system. When you load an HTML file it has a concept of a "current directory". However the technique you are using does not have a containing directory as such.

If you somehow logged out __dirname from your text/html trick the current __dirname will not be set to a value inside your application.

For instance when testing with an Electron Prebuilt (the default app).

# In the default app console
__dirname === "C:\Users\Samuel\.electron\electron-v1.4.2-win32-x64\resources\default_app.asar"

# In the "data/html" loaded window
__dirname === "C:\Users\Samuel\.electron\electron-v1.4.2-win32-x64\resources\electron.asar\renderer"

The second path is not even inside the current application ASAR so the require search path will be completely different. I'm pretty sure this is the expected behavior as there is no other logical directory we can assign to this pseudo HTML file.

nikita-graf · 2017-01-23T12:46:11Z

Here is the code that makes require work in html template.

electron/lib/renderer/init.js

Line 111 in d064325

module.paths = module.paths.concat(Module._nodeModulePaths(global.__dirname))

As a temporary workaround I've set up module.paths and module.filename inside data:text/html template and require started working.

kevinsawicki · 2017-01-24T23:58:28Z

I'm like 99% sure this is "expected" in a sense. Whenever you use require it scans the current directory and then recursively each directory until you reach the root of the current file system.

Yeah, pages using require from data URLs will probably need to set up the module global as @nikita-graf mentioned since Electron only knows how to make relative node requires work when a file URL is used.

Closing this out since this the expected behavior, thanks @MarshallOfSound for the in-depth explanation 👍

seanchas116 · 2017-04-21T01:03:06Z

FYI the original 'not working' version now works well as #9095 is merged.
You can now require modules installed in app directory from non-file: urls without workarounds.

kevinsawicki closed this as completed Jan 24, 2017

seanchas116 mentioned this issue Apr 3, 2017

Search for module from app path when URL is not file protocol #9095

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

problems with requiring modules with "win.loadURL(`data:text/html;charset=utf-8,${html}`)" #8425

problems with requiring modules with "win.loadURL(`data:text/html;charset=utf-8,${html}`)" #8425

serapath commented Jan 17, 2017

serapath commented Jan 17, 2017 •

edited

MarshallOfSound commented Jan 20, 2017

nikita-graf commented Jan 23, 2017

kevinsawicki commented Jan 24, 2017

seanchas116 commented Apr 21, 2017

problems with requiring modules with "win.loadURL(data:text/html;charset=utf-8,${html})" #8425

problems with requiring modules with "win.loadURL(data:text/html;charset=utf-8,${html})" #8425

Comments

serapath commented Jan 17, 2017

Expected behavior

Actual behavior

How to reproduce

not working version

working version

serapath commented Jan 17, 2017 • edited

MarshallOfSound commented Jan 20, 2017

nikita-graf commented Jan 23, 2017

kevinsawicki commented Jan 24, 2017

seanchas116 commented Apr 21, 2017

problems with requiring modules with "win.loadURL(`data:text/html;charset=utf-8,${html}`)" #8425

problems with requiring modules with "win.loadURL(`data:text/html;charset=utf-8,${html}`)" #8425

serapath commented Jan 17, 2017 •

edited