storybook-addon-cookie
v4.0.0-alpha.0
Published
Storybook addon for setting document.cookie
Downloads
135,193
Maintainers
Readme
Support Storybook v7
Starting with storybook-addon-cookie v3, it supports storybook v7.
Use v2.x if you're using storybook v6.x.
Features
- Set
document.cookie
for each Storybook.
Installing and Setup
Install addon
With npm:
npm i storybook-addon-cookie -D
Or with yarn:
yarn add storybook-addon-cookie -D
Configure the addon
Add package to storybook configuration.
// .storybook/main.js
module.exports = {
addons: [
// ..other addons
'storybook-addon-cookie',
],
};
Usage
You can pass cookie object into cookie
parameter.
Or control cookie by addon panel.
export default {
component: Example,
title: 'Example',
};
const Template = () => <Example />;
export const WithCookie = Template.bind({});
WithCookie.parameters = {
cookie: {
test: 'TEST!',
},
};
export const WithOutCookie = Template.bind({});
Each Story has independent cookie.
Encoding cookie
If you want to encode the cookies on the panel, you can use the cookieEncoding
option.
export const WithEncodedCookie: Story = {
parameters: {
cookie: {
test: 'TEST!',
},
cookieEncoding: true,
},
};
This option defaults to false
.
You can use this option after v3.1.0
Preserve existing cookies
If you want to preserve existing cookies, you can use the cookiePreserve
option.
Preserve existing cookies, but only manipulate the ones you specify via parameters.
export const PreserveCookies: Story = {
parameters: {
cookie: {
test: 'TEST!',
},
cookiePreserve: true,
},
};
This option defaults to false
.
You can use this option after v3.2.0