conflict between box2dweb and socket.io versions 3 and 4

[jim-miller-gac]

Discussed in #4573

^{Originally posted by jim-miller-gac December 29, 2022}
socket.io (versions 3 and 4) does not connect if box2dweb is in the global scope of the web page. Get the following error when calling the io method:

manager.js:21 Uncaught TypeError: _this.reconnection is not a function
at new Manager (manager.js:21:14)
at lookup (index.js:29:25)
at socketio-chat-with-box2d.html:27:20

https://github.com/hecht-software/box2dweb

Below is a link showing the socket.io chat demo running normally and two links to pages with the error (see error in console).
The second of the error pages has the box2dweb code in a closure in an attempt to reduce possible global-namespace interactions.

Also ran ESLint on the original and a closure-wrapped version of the box2dweb code. Rules and reports are shown below.

The problem is very likely in the box2dweb code, an interaction in the global namespace, but don't see specifically what it is.

Ideas?

Thank you.

--------- more info ---------

my node app on heroku is running:
express@4.18.2
socket.io@4.5.4
(note: the app sleeps and can take a few seconds to wake.)

socket.io chat demo running without error:
https://www.timetocode.org/socketio-chat.html

Same chat demo with box2dweb included (see error in console):
https://www.timetocode.org/socketio-chat-with-box2d.html
box2dweb:
https://www.timetocode.org/Box2D-original.js.html

Same chat demo but with box2dweb included in a closure (see error in console):
https://www.timetocode.org/socketio-chat-with-box2d-wrapped.html
box2dweb in a closure:
https://www.timetocode.org/Box2D-original-wrapped.js.html

ESLint rules and reports:

module.exports = {
"env": {
"browser": true,
"es2021": true
},
"extends": "eslint:recommended",
"overrides": [
],
"parserOptions": {
"ecmaVersion": "latest",
"sourceType": "script"
},
"rules": {
"no-extra-semi": "off",
"no-unused-vars": "off",
"no-global-assign": "error",
"no-extend-native": "error",
"no-implicit-globals": "error"
}
}

report on Box2D-original-wrapped.js

22:20 Error Shadowing of global property 'undefined'. no-shadow-restricted-names
955:17 Error Unexpected constant condition. no-constant-condition
1360:46 Error Empty block statement. no-empty
1762:13 Error Move function declaration to function body root. no-inner-declarations
1776:19 Error 'i' is already defined. no-redeclare
2980:18 Error Empty block statement. no-empty
3398:13 Error Unreachable code. no-unreachable
4488:15 Error Empty block statement. no-empty
6911:14 Error Unexpected constant condition. no-constant-condition
10199:56 Error Empty block statement. no-empty

report on Box2D-original.js

18:5 Error Unexpected 'var' declaration in the global scope, wrap in an IIFE for a local variable, assign as global property for a global variable. no-implicit-globals
20:17 Error Shadowing of global property 'undefined'. no-shadow-restricted-names
70:5 Error Unexpected 'var' declaration in the global scope, wrap in an IIFE for a local variable, assign as global property for a global variable. no-implicit-globals
71:5 Error Unexpected 'var' declaration in the global scope, wrap in an IIFE for a local variable, assign as global property for a global variable. no-implicit-globals
953:14 Error Unexpected constant condition. no-constant-condition
1358:43 Error Empty block statement. no-empty
1760:10 Error Move function declaration to function body root. no-inner-declarations
1774:16 Error 'i' is already defined. no-redeclare
2978:15 Error Empty block statement. no-empty
3396:10 Error Unreachable code. no-unreachable
4486:12 Error Empty block statement. no-empty
6909:11 Error Unexpected constant condition. no-constant-condition
10197:53 Error Empty block statement. no-empty
10864:5 Error Unexpected 'var' declaration in the global scope, wrap in an IIFE for a local variable, assign as global property for a global variable. no-implicit-globals

[darrachequesne]

Hi! I'm not familiar with box2dweb, could you please open an issue on their repository? They might be able to help us understand what is happening there.

[jim-miller-gac]

The issue is now open on the box2dweb repository also. Thank you.

[jim-miller-gac]

I see now that this is a new example of an old bug as discussed in issues 41, 43, and 44 of box2dweb. As discussed, there are several similar ways to eliminate the problem.

I chose to change Object.prototype.defineProperty to Object.defineProperty in the first IF statement:
https://www.timetocode.org/Box2D.js.html

Version 4 of socket.io is now in use:
https://www.timetocode.org

[darrachequesne]

I'm closing this, as I don't think there is much we can do.

Related: hecht-software/box2dweb#57

Please reopen if needed.