Steps

1. Resolve the WebSocket URL using the WebSocket script service. The identifier of the Yjs WebSocket endpoint is yjs.

   $services.websocket.url('yjs')

2. Use the cristal WebSocket connector, provided by npm dependency @xwiki/cristal-collaboration-xwiki.

   Installation:

   npm i --save @xwiki/cristal-collaboration-xwiki

    Use:

   import { createXWikiWebsocketProvider } from "@xwiki/cristal-collaboration-xwiki"
   
   const url = "wss://..."; // see step 1.
   const room = "My.page"; // the document reference of a page
   // The connection is rejected if the current user is not allowed to edit the page.
   const provider = createXWikiWebsocketProvider(url, room);

More