@storybook/channel-postmessage

Creating a channel for communication

This code sample demonstrates how to create a new PostmsgTransport instance and use it to create a communication channel. The 'key' is a unique identifier for the channel.

import { PostmsgTransport } from '@storybook/channel-postmessage';
const transport = new PostmsgTransport({ key: 'postmsg-key' });
const channel = createChannel({ transport });

Sending messages

This code sample shows how to send a message with an event name and associated data through the channel.

channel.emit('eventName', { payload: 'data' });

Receiving messages

This code sample illustrates how to set up a listener for a specific event name and handle the data received through the channel.

channel.on('eventName', (data) => console.log(data));