Uncaught TypeError: Cannot read property 'on' of undefined error when use raphael js in Electron


#1

Today I use Raphaël 2.1.2(JavaScript Vector Library) and morris.js v0.5.0 as below in my html and run under Electron 0.33.6.

<script src="js/raphael-min.js" type="text/javascript"></script>
<script src="js/morris.min.js" type="text/javascript"></script>

But the Electron(Renderer Window) show two errors below:
raphael-min.js:10 Uncaught TypeError: Cannot read property ‘on’ of undefined
morris.min.js:6 Uncaught ReferenceError: Raphael is not defined

If I load this html into the Google Chrome browser, Chrome shows no errors.

I think this is maybe some conflict of raphael js and electron, Can anyone tell me how to resolve this problem, Thanks!


#2

I think the issue is the same as I describe in

Try replacing the raphael script tag with

<script>
window.Raphael = require('js/raphael-min.js');
</script>

#3

Thanks for your replay.
I tested your advice, not works. The errors are same.


#4

From the Getting started section on morris.js’ site it looks like you also need jQuery to be available globally:

<script>
window.jQuery = window.$ = require('path/to/jquery.js');
window.Raphael = require('js/raphael-min.js');
</script>

#5

Many many thanks to olmokramer!

Finally, this problem resolved as the code below.
(1) First require jQuery
(2) And must require raphael which download by npm install command,
not the version download directly from raphael website.

<script>
	//jquery.min.js is download from jQuery website
	window.jQuery = window.$ = require('js/jquery.min.js');
</script>

<script>
	//Error, raphael-min.js is download from raphael website
	//window.Raphael = require('js/raphael-min.js');
		
	//OK, installed by command: npm install raphael --save
	window.Raphael = require('raphael'); 
</script>

#6

For me, the issue was that I had the ELECTRON_RUN_AS_NODE environment variable set to true.