Exploring the ins and outs of troubleshooting Nodewebkit using Webstorm

Attempting to open a NW in Webstorm for debugging purposes, but encountering an issue. When there is an error in the app, the NW window simply closes without providing any indication of what went wrong.

Stumbled upon this helpful article on the Webstorm website. In my root folder, I have app.js which includes the usual Express app setup and module inclusion. Additionally, I have a package.json:

{
  "name": "nw",
  "version": "1.0.0",
  "description": "",
  "main": "index.html",
  "node-main": "app.js",
  "scripts": {
  "test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"window": {
"toolbar": true,
"width": 800,
"height": 500
},
 "license": "ISC",
 "dependencies": {
 "jquery": "^2.1.4",
 "nw": "^0.12.2",
 "pretty-bytes": "^1.0.2"
  }
}

Alongside that, I have the following index.html file:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8>
<title>My App</title>
<script src="app.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
window.location = 'http://localhost:3000';
</script>
</body>
</html>

Encountering two main issues here:

  1. When attempting to run NW alone (simply double clicking nw.exe), the app will launch but not consistently. It closes unexpectedly about 30% of the time.

  2. Following the instructions provided by Webstorm for debugging, I experience strange results. When trying to open it within Webstorm, the NW window appears briefly before closing with the error message: Process finished with exit code 0. However, I can still open the application in regular mode outside of debug mode.

Confused by these issues and seeking insight. My Webstorm debug screen: https://i.sstatic.net/oTGxH.png

Answer №1

It seems like you haven't shared your code, but chances are you're encountering an exception that is causing your app to crash immediately.

In previous instances, the most common issue is typically related to an incorrect call to 'window':

window: As a property of 'global', it refers to the DOM window global object. It's important to note that this might be updated during page navigation. However, at the time the script is loaded, this symbol may not be available because scripts are executed before the DOM window loads (source)

If you are using 'node-main' and making use of 'window' within it, your app could crash at startup. Check for any references to 'window' in your app.js and try commenting them out. If this resolves the issue, consider encapsulating the code within functions and calling them from index.html.

If this isn't the root cause, then it's crucial to debug your code to pinpoint where it's breaking. Try removing code blocks systematically to identify the bug. Feel free to share your code for further assistance.

Answer №2

Are you all good with configuring the debugging settings in Webstorm? Remember, it's a different setup from the regular mode.

If you're looking to view console messages on Windows, Git Bash is the way to go

Answer №3

After a thorough investigation, I've finally discovered why my NW window was unexpectedly closing on occasion. Here's the gist of my setup:

In my package.json file:

 "main": "index.html",
 "node-main": "appnw.js",

Within index.html:

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8>
 <title>My App</title>
 </head>
 <body>
  <script type="text/javascript">
  setTimeout(function() {
    window.location = 'http://localhost:9000';
},1000)

The issue lay in the fact that sometimes the Express.js server failed to start while NW was attempting to access it. To resolve this, I introduced a delay using setTimeout:

  setTimeout(function() {
      app.listen(app.get('port'), function() {          
   });
  }, 2000);

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Different ways to showcase data using the Document Object Model instead of traditional tables

I'm encountering an issue with the application I'm developing. It involves working with an Oracle database to retrieve information and display it on a webpage in a table format. However, I am interested in exploring alternative methods for workin ...

Download and set up express using npm

After setting up nodejs version 0.10.26 on my Ubuntu 64-bit system successfully, I ran the commands node -v and npm -v and was able to verify the correct versions. However, when attempting to install express globally using $ sudo npm install -g express, th ...

Enhancing User Experience with Spacing in Dropdown Selections

I'm having an issue with my drop down select menu that is populated with values from the database. The text looks squished as it appears without spaces like 'TitleIsAvailable'. I tried to add spaces using the console, but the changes are not ...

Converting JavaScript values to C# code behind: A step-by-step guide

I'm facing a challenge where I need to retrieve JavaScript values in the code behind using C#. While I am aware that I can achieve this using hidden fields, there are no server controls on the page for postback. Can someone please advise me on how to ...

Is it preferable to access the binary AJAX response within the complete function of jQuery, or should we access the XHR object outside of

Dealing with binary AJAX responses in jQuery has been a significant challenge for many, as evidenced by the numerous unanswered questions on platforms like Stack Overflow. The need to dynamically detect binary data in a response and differentiate it from t ...

The MomentJS difference calculation is incorporating an additional hour

I am currently working on a project that involves time calculations. const currentCETTime = moment.tz('2020-03-18 15:58:38', 'Europe/Madrid'); const limitCETTime = moment.tz('2020-03-18 18:00:00', 'Europe/Madrid') ...

Encountering difficulties with displaying error messages on the Material UI datepicker

I am currently utilizing React Material UI There is a need to display an error based on certain conditions that will be calculated on the backend. Although I have implemented Material UI date picker, I am facing issues with displaying errors. import * as ...

Transferring information to the Carousel module

Struggling to populate the Carousel component with data from an API. The API has been tested and is returning data correctly. Oddly, when I console.log(items) at line 52 it returns undefined, but console.log(res.data) at line 54 shows the data correctly. S ...

Why is it necessary to use "new" with a Mongoose model in TypeScript?

I'm a bit confused here, but let me try to explain. When creating a new mongoose.model, I do it like this: let MyModel = moongoose.model<IMyModel>("myModel", MyModelSchema); What exactly is the difference between MyModel and let newModel = ne ...

Attempting to call setState (or forceUpdate) on a component that has been unmounted is not permissible in React

Hello everyone! I am facing an error message in my application after unmounting the component: Warning: Can't call setState (or forceUpdate) on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, canc ...

When deploying on Vercel, template literals cannot be used inside the src attribute of an image in NextJS

My issue involves displaying the client's picture after authentication using a userdropdown menu. The process of showing the user's image and name works smoothly with nextAuth when utilizing useSession(). https://i.sstatic.net/kBBa9.png Display ...

What is the best way to customize Node.js configuration when it is executed through npm?

Check out this documentation on node config: node myapp.js --NODE_CONFIG='{"Customer":{"dbConfig":{"host":"customerdb.prod"}}}' However, if I run a npm script, all parameters will be passed to npm instead of nodejs, right? How can I pass the -- ...

The toggle-input component I implemented in React is not providing the desired level of accessibility

Having an accessibility issue with a toggle input while using VoiceOver on a Mac. The problem is that when I turn the toggle off, VoiceOver says it's on, and vice versa. How can I fix this so that VoiceOver accurately states whether the toggle is on o ...

The Datatable plugin is unable to effectively customize tables that are loaded dynamically

Within my single page application, the home page initially loads all static resources and js files. Subsequently, upon a user click event, the table is dynamically loaded. Unfortunately, the datatable customization does not seem to be applied on the newly ...

Creating various rows within a loop can be achieved by using conditional statements to determine

I am faced with a challenge of handling an array of images, among other properties, and I aim to achieve the following outcome: https://i.sstatic.net/BYajY.png As the images reach the end of the container (which fits 4 images on desktops and adjusts for ...

Issue "cannot update headers after they have been sent"

I've been working on a node.js application to retrieve movie listings using the omdb api. However, I'm encountering an error when attempting to access the /result route. The error message is as follows: Error: Can't set headers after they ar ...

Node.js is utilized to power the widgets template system, which incorporates dust server-side templates

My goal is to design a webpage with widgets using Node.js and Dust as the template engine. I want these widgets to be self-contained with their own CSS, JS, and HTML. Among the three methods listed below, which one is considered the best? And which one of ...

Adjust the x and y coordinates of the canvas renderer

Manipulating the dimensions of the canvas renderer in Three.js is straightforward: renderer = new THREE.CanvasRenderer(); renderer.setSize( 500, 300 ); However, adjusting the position of the object along the x and y axes seems more challenging. I've ...

Using jQuery to remove an iframe upon a click event

My goal is to remove an iframe whenever anything on the page is clicked. I tried using this code: $('*').on('click',function(){ $('iframe').remove(); }); However, I encountered a problem where the i ...

Ways to store data in the localStorage directly from a server

I'm facing an issue - how can I store data in localStorage that was received from the server? Should I use localStorage.setItem for this purpose? And how do I handle storing an array in localStorage? Or am I missing something here? import { HttpCli ...