Problem with electron packing: data-toggle not working


#1

Hi everybody,

I am new to building cross-platform apps with electron: I have the problem where data-toggles (collapse, dropdown etc.) work properly in my browser but not after packaging to a MacOS app.

I finally focused on the data-toggle collapse example taken from w3cschools w3c-schools (data-toggle) to show/hide a paragraph.

I only replaced the js/css links to the downloaded versions to avoid possible connection errors.
I took care to have jQuery indicated before bootstrap and have indicate “type=‘text/javascript’” in the script field (which should not actually be necessary anymore).
Moreover, I tried a jQuery approach instead of relying on bootstrap data-toggle using the following code snippet:


#2

Sorry the quoted code snippet stopped saving the rest of the message. It follows here (without the jQuery code).

(…)
All trials had the same effect: The webpage is packed correctly (using ‘npm run package-mac’) but the button is not reactive and DOES NOT TOGGLE the paragraph.

Can you help me? I don’t know what to do anymore…

package.json and main.html


#3

SOLVED (somehow)

The reason of this error was that jQuery was not found by bootstrap - although it was defined beforehand.
Accidentally, I pasted twice the jQuery source link (i.e. had two linkes with “src='js/jquery.min.js” one after each other) and voila it works.

This sees to being an bug for me and in the browser it work with merely one jQuery import. Works though :slight_smile:

Please submit your comments in case of some further insights.

main.html and package.json working versions
using electron v1.4.15 and electron-prebuilt v0.35.6.


#4

SOLVED

Please find a link to the bug report and the helpful comments of the support team.
https://github.com/electron-userland/electron-packager/issues/564

I followed the first recommendation, i.e. disabling the nodeIntegration by the following line:
mainWindow = new BrowserWindow({width: 1440, height: 1024, titleBarStyle: 'hidden', nodeIntegration:false});

It works fine. Thanks a lot to the great support.