Skip to content

Commit b118e64

Browse files
committed
feat(share): support transportLogger
1 parent 8d5d80a commit b118e64

File tree

6 files changed

+189
-11
lines changed

6 files changed

+189
-11
lines changed

packages/reactant-share/src/createApp.ts

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -151,11 +151,13 @@ const createSharedTabApp = async <T, S extends any[], R extends Renderer<S>>(
151151
options.share.transports ??= {};
152152
options.share.transports.client ??= createBroadcastTransport(
153153
options.share.name,
154-
options.share.enableTransportDebugger
154+
options.share.enableTransportDebugger,
155+
options.share.transportLogger
155156
);
156157
options.share.transports.server ??= createBroadcastTransport(
157158
options.share.name,
158-
options.share.enableTransportDebugger
159+
options.share.enableTransportDebugger,
160+
options.share.transportLogger
159161
);
160162
if (options.share.port) {
161163
const app = createBaseApp(options);
@@ -299,13 +301,15 @@ export const createSharedApp = async <
299301
worker: options.share.worker as SharedWorker,
300302
prefix: `reactant-share:${options.share.name}`,
301303
verbose: options.share.enableTransportDebugger,
304+
logger: options.share.transportLogger,
302305
});
303306
}
304307

305308
if (options.share.port === 'server') {
306309
transports.server ??= createTransport('SharedWorkerInternal', {
307310
prefix: `reactant-share:${options.share.name}`,
308311
verbose: options.share.enableTransportDebugger,
312+
logger: options.share.transportLogger,
309313
});
310314
} else if (options.share.port === 'client' && !transports.client) {
311315
if (typeof options.share.workerURL !== 'string') {
@@ -317,6 +321,7 @@ export const createSharedApp = async <
317321
worker: new SharedWorker(options.share.workerURL),
318322
prefix: `reactant-share:${options.share.name}`,
319323
verbose: options.share.enableTransportDebugger,
324+
logger: options.share.transportLogger,
320325
});
321326
}
322327
options.share.transports = transports;

packages/reactant-share/src/createTransport.ts

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,15 @@
11
import { BroadcastChannel } from 'broadcast-channel';
2-
import { createTransport, Transport } from 'data-transport';
2+
import {
3+
createTransport,
4+
Transport,
5+
type TransportOptions,
6+
} from 'data-transport';
37

4-
export const createBroadcastTransport = (name: string, verbose?: boolean) => {
8+
export const createBroadcastTransport = (
9+
name: string,
10+
verbose?: boolean,
11+
logger?: TransportOptions['logger']
12+
) => {
513
const broadcastChannel = new BroadcastChannel(
614
`reactant-share-channel:${name}`
715
);
@@ -18,6 +26,7 @@ export const createBroadcastTransport = (name: string, verbose?: boolean) => {
1826
sender: (message) => broadcastChannel.postMessage(JSON.stringify(message)),
1927
prefix: `reactant-share:${name}`,
2028
verbose,
29+
logger,
2130
});
2231
return transport;
2332
};

packages/reactant-share/src/interfaces.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import type {
55
EmitParameter,
66
MergeInteraction,
77
Transport,
8+
TransportOptions,
89
} from 'data-transport';
910
import type { Config as BaseConfig, App, Renderer } from 'reactant';
1011
import type { ILastActionData } from 'reactant-last-action';
@@ -96,6 +97,10 @@ export interface ISharedAppOptions {
9697
* Enable transport debugger for shared app.
9798
*/
9899
enableTransportDebugger?: boolean;
100+
/**
101+
* Transport logger for shared app.
102+
*/
103+
transportLogger?: TransportOptions['logger'];
99104
/**
100105
* Transform client/server port
101106
*/
Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,29 @@
1-
import { createTransport, mockPorts } from 'data-transport';
1+
import {
2+
createTransport,
3+
mockPorts,
4+
type TransportOptions,
5+
} from 'data-transport';
26

37
/**
48
* mock pair transports
59
*/
6-
export const mockPairTransports = () => {
10+
export const mockPairTransports = (options?: {
11+
serverLogger?: TransportOptions['logger'];
12+
serverVerbose?: boolean;
13+
clientLogger?: TransportOptions['logger'];
14+
clientVerbose?: boolean;
15+
}) => {
716
const { create, main } = mockPorts();
8-
return [createTransport('Base', main), createTransport('Base', create())];
17+
return [
18+
createTransport('Base', {
19+
...main,
20+
logger: options?.serverLogger,
21+
verbose: options?.serverVerbose,
22+
}),
23+
createTransport('Base', {
24+
...create(),
25+
logger: options?.clientLogger,
26+
verbose: options?.clientVerbose,
27+
}),
28+
];
929
};

packages/reactant-share/src/modules/coworker.ts

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,11 @@ import {
1919
nameKey,
2020
Service,
2121
} from 'reactant';
22-
import { createTransport, Transport } from 'data-transport';
22+
import {
23+
createTransport,
24+
Transport,
25+
type TransportOptions,
26+
} from 'data-transport';
2327
import type { ILastActionData } from 'reactant-last-action';
2428

2529
import { PortDetector } from './portDetector';
@@ -70,6 +74,10 @@ export interface ICoworkerOptions {
7074
* Enable transport debugger for coworker.
7175
*/
7276
enableTransportDebugger?: boolean;
77+
/**
78+
* Logger for coworker.
79+
*/
80+
logger?: TransportOptions['logger'];
7381
/**
7482
* coworker transports
7583
*/
@@ -164,6 +172,7 @@ export class Coworker extends PluginModule {
164172
createTransport('Broadcast', {
165173
prefix: this.prefix,
166174
verbose: this.coworkerOptions?.enableTransportDebugger,
175+
logger: this.coworkerOptions?.logger,
167176
})
168177
);
169178
}
@@ -173,6 +182,7 @@ export class Coworker extends PluginModule {
173182
createTransport('Broadcast', {
174183
prefix: this.prefix,
175184
verbose: this.coworkerOptions?.enableTransportDebugger,
185+
logger: this.coworkerOptions?.logger,
176186
})
177187
);
178188
}
@@ -187,6 +197,7 @@ export class Coworker extends PluginModule {
187197
{
188198
prefix: this.prefix,
189199
verbose: this.coworkerOptions?.enableTransportDebugger,
200+
logger: this.coworkerOptions?.logger,
190201
}
191202
)
192203
);
@@ -203,12 +214,14 @@ export class Coworker extends PluginModule {
203214
worker: this.coworkerOptions.worker,
204215
prefix: this.prefix,
205216
verbose: this.coworkerOptions.enableTransportDebugger,
217+
logger: this.coworkerOptions?.logger,
206218
});
207219
}
208220
return createTransport('SharedWorkerClient', {
209221
worker: this.coworkerOptions.worker,
210222
prefix: this.prefix,
211223
verbose: this.coworkerOptions.enableTransportDebugger,
224+
logger: this.coworkerOptions?.logger,
212225
});
213226
}
214227
}

packages/reactant-share/test/index.test.tsx

Lines changed: 129 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -266,9 +266,14 @@ describe('base', () => {
266266
expect(serverApp.instance.counter.num).toBe(4);
267267
expect(result2).toBe(4);
268268

269-
const result3 = await delegate(clientApp.instance.counter, 'setNum', [5], {
270-
respond: false,
271-
});
269+
const result3 = await delegate(
270+
clientApp.instance.counter,
271+
'setNum',
272+
[5],
273+
{
274+
respond: false,
275+
}
276+
);
272277

273278
expect(clientApp.instance.counter.num).toBe(3);
274279
expect(serverApp.instance.counter.num).toBe(5);
@@ -492,6 +497,127 @@ describe('base', () => {
492497
expect(fn.mock.calls.length).toBe(3);
493498
});
494499

500+
test('base server/Minimal set client port mode with enableTransportDebugger and transportLogger', async () => {
501+
const serverLogger = jest.fn();
502+
const clientLogger = jest.fn();
503+
const transports = mockPairTransports({
504+
serverLogger,
505+
clientLogger,
506+
serverVerbose: true,
507+
clientVerbose: true,
508+
});
509+
510+
const serverApp = await createSharedApp({
511+
modules: [{ provide: 'todoList', useClass: TodoList }],
512+
main: AppView,
513+
render,
514+
share: {
515+
name: 'counter',
516+
type: 'Base',
517+
port: 'server',
518+
transports: {
519+
server: transports[0],
520+
},
521+
enableTransportDebugger: true,
522+
transportLogger: serverLogger,
523+
},
524+
});
525+
act(() => {
526+
serverApp.bootstrap(serverContainer);
527+
});
528+
expect(serverContainer.querySelector('#count')?.textContent).toBe('0');
529+
530+
const clientApp = await createSharedApp({
531+
modules: [],
532+
main: AppView,
533+
render,
534+
share: {
535+
name: 'counter',
536+
type: 'Base',
537+
port: 'client',
538+
transports: {
539+
client: transports[1],
540+
},
541+
enablePatchesFilter: true,
542+
transportLogger: clientLogger,
543+
enableTransportDebugger: true,
544+
},
545+
});
546+
await clientApp.bootstrap(clientContainer);
547+
expect(clientContainer.querySelector('#count')?.textContent).toBe('0');
548+
549+
act(() => {
550+
serverContainer
551+
.querySelector('#increase')!
552+
.dispatchEvent(new MouseEvent('click', { bubbles: true }));
553+
});
554+
555+
// waiting for sync state
556+
await new Promise((resolve) => setTimeout(resolve));
557+
558+
expect(serverContainer.querySelector('#count')?.textContent).toBe('1');
559+
expect(clientContainer.querySelector('#count')?.textContent).toBe('1');
560+
561+
expect(clientApp.store?.getState().counter.obj.number).toBe(1);
562+
563+
act(() => {
564+
clientContainer
565+
.querySelector('#increase')!
566+
.dispatchEvent(new MouseEvent('click', { bubbles: true }));
567+
});
568+
569+
// waiting for sync state
570+
await new Promise((resolve) => setTimeout(resolve));
571+
572+
expect(serverContainer.querySelector('#count')?.textContent).toBe('2');
573+
expect(clientContainer.querySelector('#count')?.textContent).toBe('2');
574+
575+
expect(clientApp.store?.getState().counter.obj.number).toBe(2);
576+
// waiting for sync state
577+
await new Promise((resolve) => setTimeout(resolve));
578+
expect(serverLogger.mock.calls.length).toBe(6);
579+
expect(clientLogger.mock.calls.length).toBe(8);
580+
act(() => {
581+
clientContainer
582+
.querySelector('#increase')!
583+
.dispatchEvent(new MouseEvent('click', { bubbles: true }));
584+
});
585+
// waiting for sync state
586+
await new Promise((resolve) => setTimeout(resolve));
587+
588+
const fn = jest.fn();
589+
clientApp.store!.subscribe(fn);
590+
expect(fn.mock.calls.length).toBe(0);
591+
await serverApp.container.get(PortDetector).syncToClients();
592+
expect(fn.mock.calls.length).toBe(1);
593+
594+
await clientApp.container
595+
.get(PortDetector)
596+
.syncFullState({ forceSync: false });
597+
expect(fn.mock.calls.length).toBe(1);
598+
expect(clientApp.container.get(LastAction).sequence).toBe(
599+
serverApp.container.get(LastAction).sequence
600+
);
601+
602+
clientApp.container.get(LastAction).sequence = -1;
603+
await clientApp.container
604+
.get(PortDetector)
605+
.syncFullState({ forceSync: false });
606+
expect(fn.mock.calls.length).toBe(2);
607+
608+
await clientApp.container
609+
.get(PortDetector)
610+
.syncFullState({ forceSync: false });
611+
expect(fn.mock.calls.length).toBe(2);
612+
613+
await clientApp.container.get(PortDetector).syncFullState();
614+
expect(fn.mock.calls.length).toBe(3);
615+
// waiting for sync state
616+
await new Promise((resolve) => setTimeout(resolve));
617+
expect(serverLogger.mock.calls.length).toBe(13);
618+
expect(clientLogger.mock.calls.length).toBe(20);
619+
});
620+
495621
test('base SPA mode', async () => {
496622
onServerFn = jest.fn();
497623
subscribeOnServerFn = jest.fn();

0 commit comments

Comments
 (0)