Breakpoints in react event handlers not hit

[bxantus]

I have simple React app, using typescript.
Debugger works fine most of the time, but breakpoints in simple event handlers aren't hit.

Here's the relevant code snippet:

export default class Search extends React.Component {
    searchTextChanged(e) {
        const query = e.target.value; // <-- breakpoints aren't hit here
        console.log("Search: ", query)
    }

    render() {
        return (
            <div className="search">
                <input defaultValue="Search for" onInput={e => this.searchTextChanged(e)}></input>
            </div>
        )
    }
}

I even tried to call another method from searchTextChanged, breakpoints in it haven't hit as well.

I also tried to use bind in the onInput expression, it had no effect as well. (maybe on nonbeta fiorefox the version with bind hasn't hit, but using arrow function was fine)

Setup

I'm using firefox version 76.0b5 (64-bit)

launch.json:

{
            "type": "firefox",
            "request": "launch",
            "reAttach": true,
            "name": "Launch webradio in firefox",
            "url": "http://localhost:3000/",
            "webRoot": "${workspaceFolder}/src",
            "pathMappings": [
                { "url":"webpack:///src/*",
                  "path": "${workspaceFolder}/src/*"}
            ]
            
},

[hbenl]

Thanks for the sample code, I tried it and could hit a breakpoint in the event handler.
After some experimentation I found that breakpoints stop working completely when I change a source file while the dev server is running. The only way to get breakpoints working again is to restart the dev server but they will stop working again once you change a source file.
This seems to be due to facebook/create-react-app#6074 - a bug in CRA that has been reported more than a year ago and still isn't fixed. It affects debugging in Chrome, VSCode/Chrome and VSCode/Firefox. Only the devtools built into Firefox don't seem to be affected, I'll try to find out how they work around this bug.

Could you please verify that this is indeed the same issue that you are seeing? Please try restarting the dev server and then check if breakpoints start working again.

[hbenl]

Don't forget to restart your debugging session after restarting the dev server, otherwise breakpoints will still not work...

[bxantus]

Thanks for investigating this issue.
You're completely right, with a fresh dev server start, I can debug all kinds of codes.

Probably I newly added the event handler function, when I was experiencing this issue, and this has nothing to do with firefox nor with the debug extension.

I will try to use some other kind of dev server, or start a new instance, when I want to debug.