test: validate Room availability

src/__mocks__/trystero.ts

@@ -0,0 +1,26 @@
+import { joinRoom as trysteroJoinRoom, RoomConfig, Room } from 'trystero'
+
+export const joinRoom: typeof trysteroJoinRoom = (
+  _config: RoomConfig,
+  _roomId: string
+) => {
+  const room: Room = {
+    makeAction: () => [() => {}, () => {}, () => {}],
+    ping: () => Promise.resolve(0),
+    leave: () => {},
+    getPeers: () => [],
+    addStream: () => [Promise.resolve()],
+    removeStream: () => {},
+    addTrack: () => [Promise.resolve()],
+    removeTrack: () => {},
+    replaceTrack: () => [Promise.resolve()],
+    onPeerJoin: () => {},
+    onPeerLeave: () => {},
+    onPeerStream: () => {},
+    onPeerTrack: () => {},
+  }
+
+  return room
+}
+
+export const selfId = ''

src/components/Room/Room.test.tsx

@@ -0,0 +1,20 @@
+import { render } from '@testing-library/react'
+import { MemoryRouter as Router, Route, Routes } from 'react-router-dom'
+
+import { Room } from './'
+
+const getRoomStub = () => {
+  return (
+    <Router initialEntries={['/public/abc123']}>
+      <Routes>
+        <Route path="/public/:roomId" element={<Room />}></Route>
+      </Routes>
+    </Router>
+  )
+}
+
+describe('Room', () => {
+  test('is available', () => {
+    render(getRoomStub())
+  })
+})

src/components/Room/Room.tsx

@@ -9,7 +9,13 @@ import { usePeerRoom, usePeerRoomAction } from 'hooks/usePeerRoom'
 import { PeerActions } from 'models/network'
 import { UnsentMessage, ReceivedMessage } from 'models/chat'
 
-export function Room() {
+export interface RoomProps {
+  appId?: string
+}
+
+export function Room({
+  appId = `${encodeURI(window.location.origin)}_${process.env.REACT_APP_NAME}`,
+}: RoomProps) {
   const { roomId = '' } = useParams()
 
   const [textMessage, setTextMessage] = useState('')
@@ -18,7 +24,7 @@ export function Room() {
   )
 
   const peerRoom = usePeerRoom({
-    appId: `${encodeURI(window.location.origin)}_${process.env.REACT_APP_NAME}`,
+    appId,
     roomId,
   })