Don’t worry about that for the time being, we’ll have a thorough look at it in upcoming posts. The app’s state changes go hand in hand with the actions being dispatched, however, the app’s state is not being inspected in this GIF example. Described below is the sequence 1.e4 e5 in terms of actions.Į4: PICK_PIECE LEGAL_MOVES LEAVE_PIECE VALID_MOVEĮ5: PICK_PIECE LEGAL_MOVES LEAVE_PIECE VALID_MOVE Redux DevTools helps you visually understand what’s going on and therefore debug your apps hopefully, it’ll be self-explanatory that a valid chess move is broken down into four Redux actions. Set a breakpoint in your source file and click on debug icon. The URL should point to the web application root 4. PICK_PIECE LEGAL_MOVES LEAVE_PIECE VALID_MOVE PICK_PIECE LEGAL_MOVES LEAVE_PIECE VALID_MOVE FLIP_BOARD OPEN_GET_PGN_DIALOG CLOSE_GET_PGN_DIALOG Create a new JavaScript Run/Debug configuration. CONNECTION_ESTABLISHED INFO_CLOSE_ALERT STARTĪnd here is the sequence of actions dispatched as a result of the user interaction with the UI. Listed below are the Redux actions which are automatically dispatched under the hood right after the application is started. Theyve been improving their async debugger, take into account when the application uses reactor-tools, etc. 1.e4 e5 is played in the Analysis Board, followed by a board flip and a PGN Movetext dialog being opened from the ⚙ Settings menu. IntelliJ has support for Reactor debugging since 2019.3 IIRC. This example shows how the app’s state changes as the user interacts with the UI by dispatching actions. The Redux tab really helps to debug the application’s state changes.

React intellij debug