Add better support for binary data on WebSocket connections (#5897)

* add /binary data endpoint to smoke test server

* add function to deal with diff event.data types

* step 1

* step 2

* final step

* CR improvements

* update deps & fix type-check
This commit is contained in:
Filipe Freire
2023-04-24 17:40:51 +01:00
committed by GitHub
parent 12d027fc24
commit 47a1cea2be
7 changed files with 60 additions and 36 deletions

View File

@@ -22,7 +22,7 @@
"@types/mkdirp": "^1.0.1",
"@types/oidc-provider": "^7.8.1",
"@types/uuid": "^8.3.4",
"@types/ws": "^8.5.3",
"@types/ws": "^8.5.4",
"concurrently": "^7.0.0",
"cross-env": "^7.0.3",
"esbuild-runner": "2.2.1",
@@ -37,7 +37,7 @@
"mkdirp": "^1.0.4",
"oidc-provider": "^7.10.6",
"uuid": "^8.3.2",
"ws": "^8.8.1",
"ws": "^8.13.0",
"xvfb-maybe": "^0.2.1"
}
},
@@ -1491,9 +1491,9 @@
"dev": true
},
"node_modules/@types/ws": {
"version": "8.5.3",
"resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.3.tgz",
"integrity": "sha512-6YOoWjruKj1uLf3INHH7D3qTXwFfEsg1kf3c0uDdSBJwfa/llkwIjrAGV7j7mVgGNbzTQ3HiHKKDXl6bJPD97w==",
"version": "8.5.4",
"resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.4.tgz",
"integrity": "sha512-zdQDHKUgcX/zBc4GrwsE/7dVdAD8JR4EuiAXiiUhhfyIJXXb2+PrGshFyeXWQPMmmZ2XxgaqclgpIC7eTXc1mg==",
"dev": true,
"dependencies": {
"@types/node": "*"
@@ -6094,16 +6094,16 @@
}
},
"node_modules/ws": {
"version": "8.8.1",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.8.1.tgz",
"integrity": "sha512-bGy2JzvzkPowEJV++hF07hAD6niYSr0JzBNo/J29WsB57A2r7Wlc1UFcTR9IzrPvuNVO4B8LGqF8qcpsVOhJCA==",
"version": "8.13.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.13.0.tgz",
"integrity": "sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA==",
"dev": true,
"engines": {
"node": ">=10.0.0"
},
"peerDependencies": {
"bufferutil": "^4.0.1",
"utf-8-validate": "^5.0.2"
"utf-8-validate": ">=5.0.2"
},
"peerDependenciesMeta": {
"bufferutil": {
@@ -7447,9 +7447,9 @@
"dev": true
},
"@types/ws": {
"version": "8.5.3",
"resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.3.tgz",
"integrity": "sha512-6YOoWjruKj1uLf3INHH7D3qTXwFfEsg1kf3c0uDdSBJwfa/llkwIjrAGV7j7mVgGNbzTQ3HiHKKDXl6bJPD97w==",
"version": "8.5.4",
"resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.4.tgz",
"integrity": "sha512-zdQDHKUgcX/zBc4GrwsE/7dVdAD8JR4EuiAXiiUhhfyIJXXb2+PrGshFyeXWQPMmmZ2XxgaqclgpIC7eTXc1mg==",
"dev": true,
"requires": {
"@types/node": "*"
@@ -10905,9 +10905,9 @@
}
},
"ws": {
"version": "8.8.1",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.8.1.tgz",
"integrity": "sha512-bGy2JzvzkPowEJV++hF07hAD6niYSr0JzBNo/J29WsB57A2r7Wlc1UFcTR9IzrPvuNVO4B8LGqF8qcpsVOhJCA==",
"version": "8.13.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.13.0.tgz",
"integrity": "sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA==",
"dev": true,
"requires": {}
},

View File

@@ -41,7 +41,7 @@
"@types/mkdirp": "^1.0.1",
"@types/oidc-provider": "^7.8.1",
"@types/uuid": "^8.3.4",
"@types/ws": "^8.5.3",
"@types/ws": "^8.5.4",
"concurrently": "^7.0.0",
"cross-env": "^7.0.3",
"esbuild-runner": "2.2.1",
@@ -56,7 +56,7 @@
"mkdirp": "^1.0.4",
"oidc-provider": "^7.10.6",
"uuid": "^8.3.2",
"ws": "^8.8.1",
"ws": "^8.13.0",
"xvfb-maybe": "^0.2.1"
}
}

View File

@@ -30,6 +30,16 @@ const handleConnection = (ws: WebSocket, req: IncomingMessage) => {
ws.send(message);
return;
}
// Returns binary data
if (req.url === '/binary') {
ws.send(Buffer.alloc(0));
ws.send(Buffer.from('test'));
ws.send(message);
ws.send(message.toString());
return;
}
if (message.toString() === 'close') {
ws.close(1003, 'Invalid message type');
}

View File

@@ -103,7 +103,7 @@
"@types/tough-cookie": "^2.3.7",
"@types/uuid": "^8.3.4",
"@types/vkbeautify": "^0.99.2",
"@types/ws": "^8.5.3",
"@types/ws": "^8.5.4",
"@types/xmldom": "0.1.30",
"@types/yaml": "^1.9.7",
"@vitejs/plugin-react": "^2.2.0",
@@ -156,7 +156,7 @@
"typescript-json-schema": "^0.50.1",
"vite": "^3.2.3",
"vkbeautify": "^0.99.1",
"ws": "^8.8.1",
"ws": "^8.13.0",
"xmldom": "^0.5.0",
"xpath": "0.0.32"
}
@@ -7159,9 +7159,9 @@
"dev": true
},
"node_modules/@types/ws": {
"version": "8.5.3",
"resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.3.tgz",
"integrity": "sha512-6YOoWjruKj1uLf3INHH7D3qTXwFfEsg1kf3c0uDdSBJwfa/llkwIjrAGV7j7mVgGNbzTQ3HiHKKDXl6bJPD97w==",
"version": "8.5.4",
"resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.4.tgz",
"integrity": "sha512-zdQDHKUgcX/zBc4GrwsE/7dVdAD8JR4EuiAXiiUhhfyIJXXb2+PrGshFyeXWQPMmmZ2XxgaqclgpIC7eTXc1mg==",
"dev": true,
"dependencies": {
"@types/node": "*"
@@ -21254,16 +21254,16 @@
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
},
"node_modules/ws": {
"version": "8.8.1",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.8.1.tgz",
"integrity": "sha512-bGy2JzvzkPowEJV++hF07hAD6niYSr0JzBNo/J29WsB57A2r7Wlc1UFcTR9IzrPvuNVO4B8LGqF8qcpsVOhJCA==",
"version": "8.13.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.13.0.tgz",
"integrity": "sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA==",
"dev": true,
"engines": {
"node": ">=10.0.0"
},
"peerDependencies": {
"bufferutil": "^4.0.1",
"utf-8-validate": "^5.0.2"
"utf-8-validate": ">=5.0.2"
},
"peerDependenciesMeta": {
"bufferutil": {
@@ -27218,9 +27218,9 @@
"dev": true
},
"@types/ws": {
"version": "8.5.3",
"resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.3.tgz",
"integrity": "sha512-6YOoWjruKj1uLf3INHH7D3qTXwFfEsg1kf3c0uDdSBJwfa/llkwIjrAGV7j7mVgGNbzTQ3HiHKKDXl6bJPD97w==",
"version": "8.5.4",
"resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.5.4.tgz",
"integrity": "sha512-zdQDHKUgcX/zBc4GrwsE/7dVdAD8JR4EuiAXiiUhhfyIJXXb2+PrGshFyeXWQPMmmZ2XxgaqclgpIC7eTXc1mg==",
"dev": true,
"requires": {
"@types/node": "*"
@@ -38030,9 +38030,9 @@
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
},
"ws": {
"version": "8.8.1",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.8.1.tgz",
"integrity": "sha512-bGy2JzvzkPowEJV++hF07hAD6niYSr0JzBNo/J29WsB57A2r7Wlc1UFcTR9IzrPvuNVO4B8LGqF8qcpsVOhJCA==",
"version": "8.13.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-8.13.0.tgz",
"integrity": "sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA==",
"dev": true,
"requires": {}
},

View File

@@ -155,7 +155,7 @@
"@types/tough-cookie": "^2.3.7",
"@types/uuid": "^8.3.4",
"@types/vkbeautify": "^0.99.2",
"@types/ws": "^8.5.3",
"@types/ws": "^8.5.4",
"@types/xmldom": "0.1.30",
"@types/yaml": "^1.9.7",
"@vitejs/plugin-react": "^2.2.0",
@@ -208,7 +208,7 @@
"typescript-json-schema": "^0.50.1",
"vite": "^3.2.3",
"vkbeautify": "^0.99.1",
"ws": "^8.8.1",
"ws": "^8.13.0",
"xmldom": "^0.5.0",
"xpath": "0.0.32"
},

View File

@@ -114,6 +114,9 @@ const EventMessageCell = styled('div')({
const getMessage = (event: WebSocketEvent): string => {
switch (event.type) {
case 'message': {
if ('data' in event && typeof event.data === 'object') {
return 'Binary data';
}
return event.data.toString();
}
case 'open': {

View File

@@ -38,8 +38,19 @@ const PreviewPaneContents = styled.div({
});
export const MessageEventView: FC<Props<WebSocketMessageEvent>> = ({ event, requestId }) => {
// TODO: Handle non-string data.
const raw = event.data.toString('utf-8');
let raw = event.data.toString();
// Best effort to parse the binary data as a string
try {
// @ts-expect-error -- should be fine
if ('data' in event && typeof event.data === 'object' && 'data' in event.data && Array.isArray(event.data.data)) {
// @ts-expect-error -- should be fine
raw = Buffer.from(event.data.data).toString();
}
} catch (err) {
console.error('Failed to parse event data to string, defaulting to JSON.stringify', err);
raw = JSON.stringify(event.data);
}
const handleDownloadResponseBody = useCallback(async () => {
const { canceled, filePath: outputPath } = await window.dialog.showSaveDialog({