Issue 1:
Electron version: v1.0.2

Operating system: Windows 10

I'm trying to evaluate jQuery frameworks for use with Electron/Angular.

However, the $(document).ready is never called on my page, so the UI elements never "light up".

I've tried jQuery several packages, and while they all work in a Web app, they all fail to work in Electron.

What am I missing to make them work?

main.js

const {app, BrowserWindow} = require('electron');
var mainWindow = null;

app.on('window-all-closed', () => {
if (process.platform != 'darwin') {
app.quit();
}
});

app.on('ready', () => {
mainWindow = new BrowserWindow({width: 800, height: 600});
mainWindow.loadURL(`file://${__dirname}/jqwidgets.html`);
mainWindow.on('closed', () => {
mainWindow = null;
});
});

jqwidgets.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta name="keywords" content="jQuery Splitter, Splitter Widget, Splitter, jqxSplitter" />
<meta name="description" content="This page demonstrates splitter's events" />
<title id='Description'>This demonstration shows how to trigger the jqxSplitter events.
</title>
<link rel="stylesheet" href="jqwidgets/jqwidgets/styles/jqx.base.css" type="text/css"/>
<script type="text/javascript" src="jqwidgets/scripts/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="jqwidgets/jqwidgets/jqxcore.js"></script>
<script type="text/javascript" src="jqwidgets/jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="jqwidgets/jqwidgets/jqxsplitter.js"></script>
<script type="text/javascript" src="jqwidgets/jqwidgets/jqxscrollbar.js"></script>
<script type="text/javascript" src="jqwidgets/jqwidgets/jqxpanel.js"></script>
<script type="text/javascript">
$(document).ready(function () {
alert('hi')
$('#mainSplitter').jqxSplitter({ width: 600, height: 480, panels: [{ size: 200}] });
$('#mainSplitter').on('resize', function (event) {
displayEvent(event);
});
$('#mainSplitter').on('expanded', function (event) {
displayEvent(event);
});
$('#mainSplitter').on('collapsed', function (event) {
displayEvent(event);
});
function capitaliseFirstLetter(string) {
return string.charAt(0).toUpperCase() + string.slice(1);
}
function displayEvent(event) {
var eventData = "Event:" + capitaliseFirstLetter(event.type);
eventData += ", Panel 1: " + event.args.panels[0].size;
eventData += ", Panel 2: " + event.args.panels[1].size;
$('#events').jqxPanel('prepend', '<div class="item" style="margin-top: 5px;">' + eventData + '</div>');
}
$('#events').jqxPanel({height: '100px', width: '450px' });
});
</script>
</head>
<body class='default'>
<div id='jqxWidget'>
<div id="container" style="float: left">
<div id="mainSplitter">
<div class="splitter-panel" style="background-color:#F5FFF2;"><span style="margin: 5px;">Panel 1</span></div>
<div class="splitter-panel" style="background-color:#F5FFF2;"><span style="margin: 5px;">Panel 2</span></div>
</div>
<br />
<div style="font-family: Verdana; font-size: 13;">
Events:</div>
<div id="events" style="border-width: 0px;">
</div>
</div>
</div>
</body>
</html>

Issue 2:
jQuery contains something along this lines:

if ( typeof module === "object" && typeof module.exports === "object" ) {
// set jQuery in `module`
} else {
// set jQuery in `window`
}

module is defined, even in the browser-side scripts. This causes jQuery to ignore the window object and use module, so the other scripts won't find $ nor jQuery in global scope..

I am not sure if this is a jQuery or atom-shell bug, but I wanted to put this on the web, so others won't search as long as I did.