Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Debug GWT Applications in IntelliJ

Debug GWT Applications in IntelliJ

This is a short introduction about how to use IntelliJ to debug your GWT application running in SuperDevMode.

Prerequisites

Setup

  1. In IntelliJ add a new Run/Debug Configuration of type 'JavaScript Debug'
  2. Give it a name and enter the URL of your GWT application (that's the one you get if you press 'Copy to Clipboard' in the 'GWT Development Mode' window)
  3. Choose Chrome as the browser
  4. Add mapping(s) between your local files and remote URLs. Therefore choose the local path of your (top level) package in the section named 'Remote URLs of local files (optional):' and map it to the related URL of the code server.
    Say you have the local path src/main/java/org/jboss/hal/client and your GWT module has the short name hal. Then the remote URL would be http://127.0.0.1:9876/sourcemaps/hal/org/jboss/hal/client.
  5. If you have a maven multi module (which is the case for me) you can repeat the last step for each module you want to map. In that case you only need to make sure that you don't map the same URL twice. Use more specific mappings in that case.

Debug

  1. Make sure your GWT application is running in SuperDevMode. I'm using the GWT Maven Plugin from Thomas Broyer (https://tbroyer.github.io/gwt-maven-plugin/plugin-info.html) and execute mvn gwt:devmode from the command line. But actually it's up to you how you start SuperDevMode.
  2. Choose your Run/Debug Configuration and click 'Debug' or press ⇧F9
  3. The start page of your GWT application should be loaded in Chrome.
  4. In the browser you should see a hint saying "JetBrains IDE support is debugging this browser."
  5. Depending on your application you should see some output in the console view of IntelliJ.
  6. Add breakpoints in your code. If you setup the mappings correctly, IntelliJ should be activated pausing at your breakpoint. You can now inspect the local variables and walk down the stack.
  7. Have fun

Let me know if you have problems setting up remote debugging.

@alexephesoft

This comment has been minimized.

Copy link

@alexephesoft alexephesoft commented Nov 18, 2017

"Give it a name and enter the URL of your GWT application (that's the one you get if you press 'Copy to Clipboard' in the 'GWT Development Mode' window)" - what does "'GWT Development Mode' window" mean? I am stuck on your item #2. What url do i put? I need to debug remote server. The instructions assume I already know EVERYTHING about GWT and how to run it - why then would I need instructions in the first place? Is there way to dumb it down so the mere mortals can understand? Thank you so much in advance.

@jomarko

This comment has been minimized.

Copy link

@jomarko jomarko commented Nov 23, 2017

@hpehl please, what plugin to install into Idea to see the option 'JavaScript Debug' in Run/Debug configurations?

@kevzlou7979

This comment has been minimized.

Copy link

@kevzlou7979 kevzlou7979 commented Aug 2, 2018

Hi there I'm having an issue with the following when using the debugger

Failed to load http://localhost:9876/brokerdirect/font/material-icons/MaterialIcons-Regular.woff2: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

@kevzlou7979

This comment has been minimized.

Copy link

@kevzlou7979 kevzlou7979 commented Aug 2, 2018

I found out that there is an existing issue https://intellij-support.jetbrains.com/hc/en-us/community/posts/115000715304-Problem-with-Chrome-plugin-and-CORS regarding the CORS - Also on Intelij 2017.3 no need to use Chrome Extension

@kevzlou7979

This comment has been minimized.

Copy link

@kevzlou7979 kevzlou7979 commented Aug 2, 2018

I've tried to update my Intelij IDEA to latest version 2018.2 and you don't need the Chrome extension anymore. And the issue with source had been already fixed.

@vegegoku

This comment has been minimized.

Copy link

@vegegoku vegegoku commented Apr 25, 2019

Seems like the JavaScript debug is only available in Intellij Ultimate.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment