[DevTools Bug] Cannot remove node "366" because no matching node was found in the Store.

[vanshnayak2002]

Website or app

http://localhost:3000/welcome

Repro steps

I created token for user authentication and pass into context so that user can reuse that token to call an API

when i logout or login on my localhost i see this error

STEP 1 Create a token export const executeBasicAuthenticationService = (token) => apiClient.get(/basicauth,{ headers: { Authorization: token } })

STEP-2 Pass into context

async function login(username, password) {

const baToken = 'Basic ' + window.btoa( username + ":" + password )

try{

const response = await executeBasicAuthenticationService(baToken)

if(response.status==200){ setAuthenticated(true) setUsername(username) settoken(baToken) return true

} else {
   logout()
    return false
  
 }

} catch(error){ logout() return false }

}

function logout(){ setAuthenticated(false) settoken(null) setUsername(null) }

return (

<AuthContext.Provider value={ {isAuthenticated,setAuthenticated,login,logout,username,token} }>

{children}

</AuthContext.Provider>

)

}

How often does this bug happen?

Every time

DevTools package (automated)

react-devtools-extensions

DevTools version (automated)

5.3.1-ccb20cb88b

Error message (automated)

Cannot remove node "366" because no matching node was found in the Store.

Error call stack (automated)

at chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1174132
    at v.emit (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1141877)
    at chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1143565
    at bridgeListener (chrome-extension://fmkadmapgofadopljbjfkapdkoienihi/build/main.js:1:1551564)

Error component stack (automated)

No response

GitHub query string (automated)

https://api.github.com/search/issues?q=Cannot remove node  because no matching node was found in the Store. in:title is:issue is:open is:public label:"Component: Developer Tools" repo:facebook/react

[champagnekamal]

export const executeBasicAuthenticationService = (token) => apiClient.get(/basicauth,{ headers: { Authorization: token } })

are you even returning the response

else { logout() return false

} } catch(error){ logout() return false }

also in this case your execution is going in else and running logout and then also because it's an error its again going in catch and again running logout which cause the Cannot remove node "366" because no matching node was found in the Store.

[champagnekamal]

http://localhost:3000/welcome

and also you cant share a localhost for others to see localhost will only work on your system. to share with others you need to deploy, you can do that on github pages or netlify.

[eps1lon]

We fixed some scenarios where this could occur in React DevTools 7.0. If this issue still persists, please open a new issue.