@hocuspocus/provider 2.2.2 → 2.3.0

package/dist/packages/extension-redis/src/Redis.d.ts

@@ -69,7 +69,7 @@ export declare class Redis implements Extension {
     private subKey;
     private lockKey;
     /**
-     * Once a document is laoded, subscribe to the channel in Redis.
+     * Once a document is loaded, subscribe to the channel in Redis.
      */
     afterLoadDocument({ documentName, document }: afterLoadDocumentPayload): Promise<unknown>;
     /**

package/dist/packages/provider/src/HocuspocusProvider.d.ts

@@ -1,15 +1,15 @@
-import * as Y from 'yjs';
-import { Awareness } from 'y-protocols/awareness';
 import * as mutex from 'lib0/mutex';
 import type { CloseEvent, Event, MessageEvent } from 'ws';
+import { Awareness } from 'y-protocols/awareness';
+import * as Y from 'yjs';
 import EventEmitter from './EventEmitter.js';
-import { ConstructableOutgoingMessage, onAuthenticationFailedParameters, onCloseParameters, onDisconnectParameters, onMessageParameters, onOpenParameters, onOutgoingMessageParameters, onStatelessParameters, onStatusParameters, onSyncedParameters, WebSocketStatus, onAwarenessChangeParameters, onAwarenessUpdateParameters } from './types.js';
 import { CompleteHocuspocusProviderWebsocketConfiguration, HocuspocusProviderWebsocket } from './HocuspocusProviderWebsocket.js';
+import { ConstructableOutgoingMessage, WebSocketStatus, onAuthenticationFailedParameters, onAwarenessChangeParameters, onAwarenessUpdateParameters, onCloseParameters, onDisconnectParameters, onMessageParameters, onOpenParameters, onOutgoingMessageParameters, onStatelessParameters, onStatusParameters, onSyncedParameters } from './types.js';
 export type HocuspocusProviderConfiguration = Required<Pick<CompleteHocuspocusProviderConfiguration, 'name'>> & Partial<CompleteHocuspocusProviderConfiguration> & (Required<Pick<CompleteHocuspocusProviderWebsocketConfiguration, 'url'>> | Required<Pick<CompleteHocuspocusProviderConfiguration, 'websocketProvider'>>);
 export interface CompleteHocuspocusProviderConfiguration {
     /**
-     * The identifier/name of your document
-     */
+    * The identifier/name of your document
+    */
     name: string;
     /**
      * The actual Y.js document
@@ -59,6 +59,14 @@ export interface CompleteHocuspocusProviderConfiguration {
      * Don’t output any warnings.
      */
     quiet: boolean;
+    /**
+     * Pass `false` to start the connection manually.
+     */
+    connect: boolean;
+    /**
+     * Pass `false` to close the connection manually.
+     */
+    preserveConnection: boolean;
 }
 export declare class HocuspocusProvider extends EventEmitter {
     configuration: CompleteHocuspocusProviderConfiguration;
@@ -73,7 +81,7 @@ export declare class HocuspocusProvider extends EventEmitter {
     isConnected: boolean;
     constructor(configuration: HocuspocusProviderConfiguration);
     boundBroadcastChannelSubscriber: (data: ArrayBuffer) => void;
-    boundBeforeUnload: () => void;
+    boundPageUnload: () => void;
     boundOnOpen: (event: Event) => Promise<void>;
     boundOnMessage: (event: MessageEvent) => void;
     boundOnClose: (event: CloseEvent) => void;
@@ -88,13 +96,20 @@ export declare class HocuspocusProvider extends EventEmitter {
     get document(): Y.Doc;
     get awareness(): Awareness;
     get hasUnsyncedChanges(): boolean;
-    updateUnsyncedChanges(unsyncedChanges?: number): void;
+    incrementUnsyncedChanges(): void;
+    decrementUnsyncedChanges(): void;
     forceSync(): void;
-    beforeUnload(): void;
+    pageUnload(): void;
     registerEventListeners(): void;
     sendStateless(payload: string): void;
     documentUpdateHandler(update: Uint8Array, origin: any): void;
     awarenessUpdateHandler({ added, updated, removed }: any, origin: any): void;
+    /**
+     * Indicates whether a first handshake with the server has been established
+     *
+     * Note: this does not mean all updates from the client have been persisted to the backend. For this,
+     * use `hasUnsyncedChanges`.
+     */
     get synced(): boolean;
     set synced(state: boolean);
     receiveStateless(payload: string): void;

package/dist/packages/provider/src/HocuspocusProviderWebsocket.d.ts

@@ -2,8 +2,8 @@ import * as mutex from 'lib0/mutex';
 import type { MessageEvent } from 'ws';
 import { Event } from 'ws';
 import EventEmitter from './EventEmitter.js';
-import { onCloseParameters, onDisconnectParameters, onMessageParameters, onOpenParameters, onOutgoingMessageParameters, onStatusParameters, WebSocketStatus, onAwarenessChangeParameters, onAwarenessUpdateParameters } from './types.js';
 import { HocuspocusProvider } from './HocuspocusProvider.js';
+import { WebSocketStatus, onAwarenessChangeParameters, onAwarenessUpdateParameters, onCloseParameters, onDisconnectParameters, onMessageParameters, onOpenParameters, onOutgoingMessageParameters, onStatusParameters } from './types.js';
 export type HocuspocusProviderWebsocketConfiguration = Required<Pick<CompleteHocuspocusProviderWebsocketConfiguration, 'url'>> & Partial<CompleteHocuspocusProviderWebsocketConfiguration>;
 export interface CompleteHocuspocusProviderWebsocketConfiguration {
     /**
@@ -76,6 +76,7 @@ export interface CompleteHocuspocusProviderWebsocketConfiguration {
     quiet: boolean;
 }
 export declare class HocuspocusProviderWebsocket extends EventEmitter {
+    private messageQueue;
     configuration: CompleteHocuspocusProviderWebsocketConfiguration;
     subscribedToBroadcastChannel: boolean;
     webSocket: WebSocket | null;

package/dist/packages/provider/src/MessageReceiver.d.ts

@@ -5,8 +5,9 @@ export declare class MessageReceiver {
     broadcasted: boolean;
     constructor(message: IncomingMessage);
     setBroadcasted(value: boolean): this;
-    apply(provider: HocuspocusProvider, emitSynced?: boolean): void;
+    apply(provider: HocuspocusProvider, emitSynced: boolean): void;
     private applySyncMessage;
+    applySyncStatusMessage(provider: HocuspocusProvider, applied: boolean): void;
     private applyAwarenessMessage;
     private applyAuthMessage;
     private applyQueryAwarenessMessage;

package/dist/packages/provider/src/TiptapCollabProvider.d.ts

@@ -1,3 +1,4 @@
+import type { AbstractType, YArrayEvent } from 'yjs';
 import { HocuspocusProvider, HocuspocusProviderConfiguration } from './HocuspocusProvider.js';
 import { TiptapCollabProviderWebsocket } from './TiptapCollabProviderWebsocket.js';
 export type TiptapCollabProviderConfiguration = Required<Pick<HocuspocusProviderConfiguration, 'name'>> & Partial<HocuspocusProviderConfiguration> & (Required<Pick<AdditionalTiptapCollabProviderConfiguration, 'websocketProvider'>> | Required<Pick<AdditionalTiptapCollabProviderConfiguration, 'appId'>>);
@@ -8,6 +9,20 @@ export interface AdditionalTiptapCollabProviderConfiguration {
     appId?: string;
     websocketProvider?: TiptapCollabProviderWebsocket;
 }
+export type AuditHistoryVersion = {
+    name?: string;
+    version: number;
+    date: number;
+};
 export declare class TiptapCollabProvider extends HocuspocusProvider {
+    tiptapCollabConfigurationPrefix: string;
     constructor(configuration: TiptapCollabProviderConfiguration);
+    createVersion(name?: string): void;
+    revertToVersion(targetVersion: number): void;
+    getVersions(): AuditHistoryVersion[];
+    watchVersions(callback: Parameters<AbstractType<YArrayEvent<AuditHistoryVersion>>['observe']>[0]): void;
+    unwatchVersions(callback: Parameters<AbstractType<YArrayEvent<AuditHistoryVersion>>['unobserve']>[0]): void;
+    isAutoVersioning(): boolean;
+    enableAutoVersioning(): 1;
+    disableAutoVersioning(): 0;
 }

package/dist/packages/provider/src/types.d.ts

@@ -1,22 +1,23 @@
+import { Encoder } from 'lib0/encoding';
+import type { CloseEvent, Event, MessageEvent } from 'ws';
 import { Awareness } from 'y-protocols/awareness';
 import * as Y from 'yjs';
-import { Encoder } from 'lib0/encoding';
-import type { Event, CloseEvent, MessageEvent } from 'ws';
+import { IncomingMessage } from './IncomingMessage.js';
+import { OutgoingMessage } from './OutgoingMessage.js';
 import { AuthenticationMessage } from './OutgoingMessages/AuthenticationMessage.js';
 import { AwarenessMessage } from './OutgoingMessages/AwarenessMessage.js';
 import { QueryAwarenessMessage } from './OutgoingMessages/QueryAwarenessMessage.js';
 import { SyncStepOneMessage } from './OutgoingMessages/SyncStepOneMessage.js';
 import { SyncStepTwoMessage } from './OutgoingMessages/SyncStepTwoMessage.js';
 import { UpdateMessage } from './OutgoingMessages/UpdateMessage.js';
-import { IncomingMessage } from './IncomingMessage.js';
-import { OutgoingMessage } from './OutgoingMessage.js';
 export declare enum MessageType {
     Sync = 0,
     Awareness = 1,
     Auth = 2,
     QueryAwareness = 3,
     Stateless = 5,
-    CLOSE = 7
+    CLOSE = 7,
+    SyncStatus = 8
 }
 export declare enum WebSocketStatus {
     Connecting = "connecting",

package/dist/packages/server/src/Hocuspocus.d.ts

@@ -5,7 +5,7 @@ import WebSocket, { AddressInfo, WebSocketServer } from 'ws';
 import { Debugger } from './Debugger.js';
 import { DirectConnection } from './DirectConnection.js';
 import Document from './Document.js';
-import { Configuration, ConnectionConfiguration, HookName, HookPayload, onListenPayload, onStoreDocumentPayload } from './types.js';
+import { Configuration, ConnectionConfiguration, HookName, HookPayloadByName, onListenPayload, onStoreDocumentPayload } from './types.js';
 export declare const defaultConfiguration: {
     name: null;
     port: number;
@@ -91,7 +91,8 @@ export declare class Hocuspocus {
      * Run the given hook on all configured extensions.
      * Runs the given callback after each hook.
      */
-    hooks(name: HookName, payload: HookPayload, callback?: Function | null): Promise<any>;
+    hooks<T extends HookName>(name: T, payload: HookPayloadByName[T], callback?: Function | null): Promise<any>;
+    unloadDocument(document: Document): void;
     enableDebugging(): void;
     enableMessageLogging(): void;
     disableLogging(): void;

package/dist/packages/server/src/MessageReceiver.d.ts

@@ -1,7 +1,7 @@
 import Connection from './Connection.js';
-import { IncomingMessage } from './IncomingMessage.js';
 import { Debugger } from './Debugger.js';
 import Document from './Document.js';
+import { IncomingMessage } from './IncomingMessage.js';
 export declare class MessageReceiver {
     message: IncomingMessage;
     logger: Debugger;

package/dist/packages/server/src/OutgoingMessage.d.ts

@@ -16,5 +16,6 @@ export declare class OutgoingMessage {
     writeUpdate(update: Uint8Array): OutgoingMessage;
     writeStateless(payload: string): OutgoingMessage;
     writeBroadcastStateless(payload: string): OutgoingMessage;
+    writeSyncStatus(updateSaved: boolean): OutgoingMessage;
     toUint8Array(): Uint8Array;
 }

package/dist/packages/server/src/types.d.ts

@@ -4,9 +4,9 @@
 import { IncomingHttpHeaders, IncomingMessage, ServerResponse } from 'http';
 import { URLSearchParams } from 'url';
 import { Awareness } from 'y-protocols/awareness';
+import Connection from './Connection.js';
 import Document from './Document.js';
 import { Hocuspocus } from './Hocuspocus.js';
-import Connection from './Connection.js';
 export declare enum MessageType {
     Unknown = -1,
     Sync = 0,
@@ -16,7 +16,8 @@ export declare enum MessageType {
     SyncReply = 4,
     Stateless = 5,
     BroadcastStateless = 6,
-    CLOSE = 7
+    CLOSE = 7,
+    SyncStatus = 8
 }
 export interface AwarenessUpdate {
     added: Array<any>;
@@ -47,10 +48,31 @@ export interface Extension {
     onAwarenessUpdate?(data: onAwarenessUpdatePayload): Promise<any>;
     onRequest?(data: onRequestPayload): Promise<any>;
     onDisconnect?(data: onDisconnectPayload): Promise<any>;
+    afterUnloadDocument?(data: onLoadDocumentPayload): Promise<any>;
     onDestroy?(data: onDestroyPayload): Promise<any>;
 }
-export type HookName = 'onConfigure' | 'onListen' | 'onUpgrade' | 'onConnect' | 'connected' | 'onAuthenticate' | 'onLoadDocument' | 'afterLoadDocument' | 'beforeHandleMessage' | 'beforeBroadcastStateless' | 'onStateless' | 'onChange' | 'onStoreDocument' | 'afterStoreDocument' | 'onAwarenessUpdate' | 'onRequest' | 'onDisconnect' | 'onDestroy';
-export type HookPayload = onConfigurePayload | onListenPayload | onUpgradePayload | onConnectPayload | connectedPayload | onAuthenticatePayload | onLoadDocumentPayload | onStatelessPayload | beforeHandleMessagePayload | beforeBroadcastStatelessPayload | onChangePayload | onStoreDocumentPayload | afterStoreDocumentPayload | onAwarenessUpdatePayload | onRequestPayload | onDisconnectPayload | onDestroyPayload;
+export type HookName = 'onConfigure' | 'onListen' | 'onUpgrade' | 'onConnect' | 'connected' | 'onAuthenticate' | 'onLoadDocument' | 'afterLoadDocument' | 'beforeHandleMessage' | 'beforeBroadcastStateless' | 'onStateless' | 'onChange' | 'onStoreDocument' | 'afterStoreDocument' | 'onAwarenessUpdate' | 'onRequest' | 'onDisconnect' | 'afterUnloadDocument' | 'onDestroy';
+export type HookPayloadByName = {
+    onConfigure: onConfigurePayload;
+    onListen: onListenPayload;
+    onUpgrade: onUpgradePayload;
+    onConnect: onConnectPayload;
+    connected: connectedPayload;
+    onAuthenticate: onAuthenticatePayload;
+    onLoadDocument: onLoadDocumentPayload;
+    afterLoadDocument: onLoadDocumentPayload;
+    beforeHandleMessage: beforeHandleMessagePayload;
+    beforeBroadcastStateless: beforeBroadcastStatelessPayload;
+    onStateless: onStatelessPayload;
+    onChange: onChangePayload;
+    onStoreDocument: onStoreDocumentPayload;
+    afterStoreDocument: afterStoreDocumentPayload;
+    onAwarenessUpdate: onAwarenessUpdatePayload;
+    onRequest: onRequestPayload;
+    onDisconnect: onDisconnectPayload;
+    afterUnloadDocument: afterUnloadDocumentPayload;
+    onDestroy: onDestroyPayload;
+};
 export interface Configuration extends Extension {
     /**
      * A name for the instance, used for logging.
@@ -198,14 +220,12 @@ export interface onStoreDocumentPayload {
 export interface afterStoreDocumentPayload extends onStoreDocumentPayload {
 }
 export interface onAwarenessUpdatePayload {
-    clientsCount: number;
     context: any;
     document: Document;
     documentName: string;
     instance: Hocuspocus;
     requestHeaders: IncomingHttpHeaders;
     requestParameters: URLSearchParams;
-    update: Uint8Array;
     socketId: string;
     added: number[];
     updated: number[];
@@ -264,6 +284,10 @@ export interface onConfigurePayload {
     configuration: Configuration;
     version: string;
 }
+export interface afterUnloadDocumentPayload {
+    instance: Hocuspocus;
+    documentName: string;
+}
 export interface DirectConnection {
     transact(transaction: (document: Document) => void): Promise<void>;
     disconnect(): void;

package/dist/tests/provider/hasUnsyncedChanges.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/tests/server/afterUnloadDocument.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hocuspocus/provider",
-  "version": "2.2.2",
+  "version": "2.3.0",
   "description": "hocuspocus provider",
   "homepage": "https://hocuspocus.dev",
   "keywords": [
@@ -29,14 +29,14 @@
     "dist"
   ],
   "dependencies": {
-    "@hocuspocus/common": "^2.2.2",
+    "@hocuspocus/common": "^2.3.0",
     "@lifeomic/attempt": "^3.0.2",
     "lib0": "^0.2.47",
     "ws": "^7.5.9"
   },
   "peerDependencies": {
     "y-protocols": "^1.0.5",
-    "yjs": "^13.5.29"
+    "yjs": "^13.6.4"
   },
   "gitHead": "cd788b6a315f608ef531524409abdce1e6790726"
 }

package/src/HocuspocusProvider.ts

@@ -1,22 +1,31 @@
-import * as Y from 'yjs'
+import { awarenessStatesToArray } from '@hocuspocus/common'
 import * as bc from 'lib0/broadcastchannel'
-import { Awareness, removeAwarenessStates } from 'y-protocols/awareness'
 import * as mutex from 'lib0/mutex'
 import type { CloseEvent, Event, MessageEvent } from 'ws'
-import { awarenessStatesToArray } from '@hocuspocus/common'
+import { Awareness, removeAwarenessStates } from 'y-protocols/awareness'
+import * as Y from 'yjs'
 import EventEmitter from './EventEmitter.js'
+import {
+  CompleteHocuspocusProviderWebsocketConfiguration,
+  HocuspocusProviderWebsocket,
+} from './HocuspocusProviderWebsocket.js'
 import { IncomingMessage } from './IncomingMessage.js'
 import { MessageReceiver } from './MessageReceiver.js'
 import { MessageSender } from './MessageSender.js'
-import { SyncStepOneMessage } from './OutgoingMessages/SyncStepOneMessage.js'
-import { SyncStepTwoMessage } from './OutgoingMessages/SyncStepTwoMessage.js'
-import { QueryAwarenessMessage } from './OutgoingMessages/QueryAwarenessMessage.js'
 import { AuthenticationMessage } from './OutgoingMessages/AuthenticationMessage.js'
 import { AwarenessMessage } from './OutgoingMessages/AwarenessMessage.js'
+import { CloseMessage } from './OutgoingMessages/CloseMessage.js'
+import { QueryAwarenessMessage } from './OutgoingMessages/QueryAwarenessMessage.js'
+import { StatelessMessage } from './OutgoingMessages/StatelessMessage.js'
+import { SyncStepOneMessage } from './OutgoingMessages/SyncStepOneMessage.js'
+import { SyncStepTwoMessage } from './OutgoingMessages/SyncStepTwoMessage.js'
 import { UpdateMessage } from './OutgoingMessages/UpdateMessage.js'
 import {
   ConstructableOutgoingMessage,
+  WebSocketStatus,
   onAuthenticationFailedParameters,
+  onAwarenessChangeParameters,
+  onAwarenessUpdateParameters,
   onCloseParameters,
   onDisconnectParameters,
   onMessageParameters,
@@ -24,16 +33,7 @@ import {
   onOutgoingMessageParameters, onStatelessParameters,
   onStatusParameters,
   onSyncedParameters,
-  WebSocketStatus,
-  onAwarenessChangeParameters,
-  onAwarenessUpdateParameters,
 } from './types.js'
-import {
-  CompleteHocuspocusProviderWebsocketConfiguration,
-  HocuspocusProviderWebsocket,
-} from './HocuspocusProviderWebsocket.js'
-import { StatelessMessage } from './OutgoingMessages/StatelessMessage.js'
-import { CloseMessage } from './OutgoingMessages/CloseMessage.js'
 
 export type HocuspocusProviderConfiguration =
   Required<Pick<CompleteHocuspocusProviderConfiguration, 'name'>>
@@ -43,9 +43,9 @@ export type HocuspocusProviderConfiguration =
   )
 
 export interface CompleteHocuspocusProviderConfiguration {
-   /**
-    * The identifier/name of your document
-    */
+  /**
+  * The identifier/name of your document
+  */
    name: string,
   /**
    * The actual Y.js document
@@ -96,6 +96,16 @@ export interface CompleteHocuspocusProviderConfiguration {
    * Don’t output any warnings.
    */
   quiet: boolean,
+
+  /**
+   * Pass `false` to start the connection manually.
+   */
+  connect: boolean,
+
+  /**
+   * Pass `false` to close the connection manually.
+   */
+  preserveConnection: boolean,
 }
 
 export class HocuspocusProvider extends EventEmitter {
@@ -124,6 +134,8 @@ export class HocuspocusProvider extends EventEmitter {
     onAwarenessChange: () => null,
     onStateless: () => null,
     quiet: false,
+    connect: true,
+    preserveConnection: true,
   }
 
   subscribedToBroadcastChannel = false
@@ -209,7 +221,7 @@ export class HocuspocusProvider extends EventEmitter {
 
   boundBroadcastChannelSubscriber = this.broadcastChannelSubscriber.bind(this)
 
-  boundBeforeUnload = this.beforeUnload.bind(this)
+  boundPageUnload = this.pageUnload.bind(this)
 
   boundOnOpen = this.onOpen.bind(this)
 
@@ -242,6 +254,7 @@ export class HocuspocusProvider extends EventEmitter {
 
       this.configuration.websocketProvider = new HocuspocusProviderWebsocket({
         url: websocketProviderConfig.url,
+        connect: websocketProviderConfig.connect,
         parameters: websocketProviderConfig.parameters,
       })
     }
@@ -261,8 +274,16 @@ export class HocuspocusProvider extends EventEmitter {
     return this.unsyncedChanges > 0
   }
 
-  updateUnsyncedChanges(unsyncedChanges = 0) {
-    this.unsyncedChanges += unsyncedChanges
+  incrementUnsyncedChanges() {
+    this.unsyncedChanges += 1
+    this.emit('unsyncedChanges', this.unsyncedChanges)
+  }
+
+  decrementUnsyncedChanges() {
+    this.unsyncedChanges -= 1
+    if (this.unsyncedChanges === 0) {
+      this.synced = true
+    }
     this.emit('unsyncedChanges', this.unsyncedChanges)
   }
 
@@ -270,7 +291,7 @@ export class HocuspocusProvider extends EventEmitter {
     this.send(SyncStepOneMessage, { document: this.document, documentName: this.configuration.name })
   }
 
-  beforeUnload() {
+  pageUnload() {
     removeAwarenessStates(this.awareness, [this.document.clientID], 'window unload')
   }
 
@@ -279,7 +300,7 @@ export class HocuspocusProvider extends EventEmitter {
       return
     }
 
-    window.addEventListener('beforeunload', this.boundBeforeUnload)
+    window.addEventListener('unload', this.boundPageUnload)
   }
 
   sendStateless(payload: string) {
@@ -291,7 +312,7 @@ export class HocuspocusProvider extends EventEmitter {
       return
     }
 
-    this.updateUnsyncedChanges(1)
+    this.incrementUnsyncedChanges()
     this.send(UpdateMessage, { update, documentName: this.configuration.name }, true)
   }
 
@@ -305,6 +326,12 @@ export class HocuspocusProvider extends EventEmitter {
     }, true)
   }
 
+  /**
+   * Indicates whether a first handshake with the server has been established
+   *
+   * Note: this does not mean all updates from the client have been persisted to the backend. For this,
+   * use `hasUnsyncedChanges`.
+   */
   get synced(): boolean {
     return this.isSynced
   }
@@ -314,10 +341,6 @@ export class HocuspocusProvider extends EventEmitter {
       return
     }
 
-    if (state && this.unsyncedChanges > 0) {
-      this.updateUnsyncedChanges(-1 * this.unsyncedChanges)
-    }
-
     this.isSynced = state
     this.emit('synced', { state })
     this.emit('sync', { state })
@@ -339,6 +362,9 @@ export class HocuspocusProvider extends EventEmitter {
   disconnect() {
     this.disconnectBroadcastChannel()
     this.configuration.websocketProvider.detach(this)
+    if (!this.configuration.preserveConnection) {
+      this.configuration.websocketProvider.disconnect()
+    }
   }
 
   async onOpen(event: Event) {
@@ -366,6 +392,7 @@ export class HocuspocusProvider extends EventEmitter {
   }
 
   startSync() {
+    this.incrementUnsyncedChanges()
     this.send(SyncStepOneMessage, { document: this.document, documentName: this.configuration.name })
 
     if (this.awareness.getLocalState() !== null) {
@@ -378,7 +405,9 @@ export class HocuspocusProvider extends EventEmitter {
   }
 
   send(message: ConstructableOutgoingMessage, args: any, broadcast = false) {
-    if (!this.isConnected) return
+    if (!this.isConnected) {
+      return
+    }
 
     if (broadcast) {
       this.mux(() => { this.broadcast(message, args) })
@@ -403,7 +432,7 @@ export class HocuspocusProvider extends EventEmitter {
 
     this.emit('message', { event, message: new IncomingMessage(event.data) })
 
-    new MessageReceiver(message).apply(this)
+    new MessageReceiver(message).apply(this, true)
   }
 
   onClose(event: CloseEvent) {
@@ -455,7 +484,7 @@ export class HocuspocusProvider extends EventEmitter {
       return
     }
 
-    window.removeEventListener('beforeunload', this.boundBeforeUnload)
+    window.removeEventListener('unload', this.boundPageUnload)
   }
 
   permissionDeniedHandler(reason: string) {

package/src/HocuspocusProviderWebsocket.ts

@@ -1,18 +1,19 @@
-import * as time from 'lib0/time'
-import * as mutex from 'lib0/mutex'
-import * as url from 'lib0/url'
-import type { MessageEvent } from 'ws'
-import { retry } from '@lifeomic/attempt'
 import {
   Forbidden, MessageTooBig, Unauthorized, WsReadyStates,
 } from '@hocuspocus/common'
+import { retry } from '@lifeomic/attempt'
+import * as mutex from 'lib0/mutex'
+import * as time from 'lib0/time'
+import * as url from 'lib0/url'
+import type { MessageEvent } from 'ws'
 import { Event } from 'ws'
 import EventEmitter from './EventEmitter.js'
+import { HocuspocusProvider } from './HocuspocusProvider.js'
 import {
-  onCloseParameters, onDisconnectParameters, onMessageParameters, onOpenParameters, onOutgoingMessageParameters, onStatusParameters, WebSocketStatus,
+  WebSocketStatus,
   onAwarenessChangeParameters, onAwarenessUpdateParameters,
+  onCloseParameters, onDisconnectParameters, onMessageParameters, onOpenParameters, onOutgoingMessageParameters, onStatusParameters,
 } from './types.js'
-import { HocuspocusProvider } from './HocuspocusProvider.js'
 
 export type HocuspocusProviderWebsocketConfiguration =
   Required<Pick<CompleteHocuspocusProviderWebsocketConfiguration, 'url'>>
@@ -91,6 +92,8 @@ export interface CompleteHocuspocusProviderWebsocketConfiguration {
 }
 
 export class HocuspocusProviderWebsocket extends EventEmitter {
+  private messageQueue: any[] = []
+
   public configuration: CompleteHocuspocusProviderWebsocketConfiguration = {
     url: '',
     // @ts-ignore
@@ -208,6 +211,10 @@ export class HocuspocusProviderWebsocket extends EventEmitter {
   }
 
   attach(provider: HocuspocusProvider) {
+    if (this.status === WebSocketStatus.Disconnected && this.shouldConnect) {
+      this.connect()
+    }
+
     if (this.receivedOnOpenPayload) {
       provider.onOpen(this.receivedOnOpenPayload)
     }
@@ -241,6 +248,8 @@ export class HocuspocusProviderWebsocket extends EventEmitter {
       this.cancelWebsocketRetry = undefined
     }
 
+    this.receivedOnOpenPayload = undefined
+    this.receivedOnStatusPayload = undefined
     this.shouldConnect = true
 
     const abortableRetry = () => {
@@ -285,6 +294,7 @@ export class HocuspocusProviderWebsocket extends EventEmitter {
   createWebSocketConnection() {
     return new Promise((resolve, reject) => {
       if (this.webSocket) {
+        this.messageQueue = []
         this.webSocket.close()
         this.webSocket = null
       }
@@ -326,6 +336,8 @@ export class HocuspocusProviderWebsocket extends EventEmitter {
       this.status = WebSocketStatus.Connected
       this.emit('status', { status: WebSocketStatus.Connected })
       this.emit('connect')
+      this.messageQueue.forEach(message => this.send(message))
+      this.messageQueue = []
     }
   }
 
@@ -357,6 +369,7 @@ export class HocuspocusProviderWebsocket extends EventEmitter {
     // No message received in a long time, not even your own
     // Awareness updates, which are updated every 15 seconds.
     this.webSocket?.close()
+    this.messageQueue = []
   }
 
   registerEventListeners() {
@@ -391,6 +404,7 @@ export class HocuspocusProviderWebsocket extends EventEmitter {
 
     try {
       this.webSocket.close()
+      this.messageQueue = []
     } catch {
       //
     }
@@ -399,6 +413,8 @@ export class HocuspocusProviderWebsocket extends EventEmitter {
   send(message: any) {
     if (this.webSocket?.readyState === WsReadyStates.Open) {
       this.webSocket.send(message)
+    } else {
+      this.messageQueue.push(message)
     }
   }