diff --git a/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js b/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js index 8e6b10479de7..47dec1043dc9 100644 --- a/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js +++ b/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js @@ -12,14 +12,41 @@ import type {RNTesterModuleExample} from '../../types/RNTesterTypes'; import RNTesterText from '../../components/RNTesterText'; import * as React from 'react'; +import {useEffect, useState} from 'react'; import {StyleSheet, View} from 'react-native'; +// Per the HTML spec, no 'message' event should fire once close() has been called. +// echo.websocket.org greets each connection and echoes what it receives. The +// websocket here is immediately closed, so replies arrive while the socket is +// no longer in the OPEN state. +// +// On React-Native, the following code logs the greeting and echoed hello after close. +// On browsers, the equivalent code won't log any messages. + function Playground() { + const [log, setLog] = useState>([]); + + useEffect(() => { + const add = (s: string) => { + console.log(s); + setLog(l => [...l, s]); + }; + const ws = new WebSocket('wss://echo.websocket.org'); + ws.onopen = () => { + ws.send('hello'); + ws.close(); + add(`close() called, readyState=${ws.readyState}`); + }; + ws.onmessage = e => + add( + `message after close(): "${String(e.data)}", readyState=${ws.readyState}`, + ); + ws.onclose = e => add(`onclose code=${String(e.code)}`); + }, []); + return ( - - Edit "RNTesterPlayground.js" to change this file - + {log.join('\n')} ); }