No browser debug output in >4.3.2
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 63.2k
- Forks
- 10.3k
- Avg merge
- 11d 20h
- Merged PRs (30d)
- 2
Description
Describe the bug
When using socket.io-client version 4.3.2 and above in an app created with create-react-app, there is no browser debug output at all with localStorage.debug = '*'. Version 4.2.0 is the latest version I found that did produce correct debug output.
To Reproduce
- Start the server
- Run the client app using
react-scripts start - Open dev tools, enter
localStorage.debug = '*'in the console - Make sure 'verbose' is selected in the console's debug levels
- Refresh the page and observe the console output
Please fill the following code example:
Socket.IO server version: 4.4.0
Server
const express = require('express')
const app = express()
const server = require('http').Server(app)
const io = require('socket.io')(server, {
cors: {
origin: '*'
}
})
io.on('connection', socket => {
console.log('socket connected:' + socket.id)
})
const port = 3000
server.listen(port, function () {
console.log("Listening on *:" + port)
})
Socket.IO client version: 4.3.2
Client
import React from 'react'
import ReactDOM from 'react-dom'
import socketIOClient from 'socket.io-client'
const socket = socketIOClient('http://localhost:3000')
function App() {
return (
<div className="App">
Hello, world!
</div>
)
}
ReactDOM.render(
<App />,
document.getElementById('root')
)
Expected behavior
When reloading the page, there should be debug output written to the browser console. With version 4.2.0, the debug output is written. With version 4.3.2 and 4.4.0, there is no output.
Platform:
- Device: Chrome 96
- OS: Ubuntu 20.04
Additional context
I haven't tested this in the browser outside of a React app. I included information about the React environment in case react is somehow messing with the debug content.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the provided create-react-app reproduction using socket.io-client 4.2.0, 4.3.2, and 4.4.0, then inspect the client-side debug output in Chrome DevTools after setting localStorage.debug = '*'. Done means identifying the regression and restoring browser debug output for the affected versions without breaking the existing connection behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 48/100