Search code examples
reactjsstorybook

when i tried to add new parameter in url it override my that parameter in react storybook


I have used storybook npm in my react project, I have my url like this http://localhost:35475/?path=/story/simple-usage--client-demo , when i tried to another params in that url like http://localhost:35475/?path=/story/simple-usage--client-demo&test=123 and reoload it then it removed my test params, can anyone please help me to resolve this issue ? here i have added my code for it

import * as React from 'react';
import { storiesOf, addParameters, addDecorator } from '@storybook/react';
import { setOptions } from '@storybook/addon-options';
import { themes } from '@storybook/theming';
import './demos/helpers/index.css';
import { Toolkit } from '@projectstorm/react-canvas-core';

Toolkit.TESTING = true;

addParameters({
    options: {
        theme: themes.dark,
    }
});

setOptions({
    name: 'STORM React Diagrams',
    url: 'https://github.com/projectstorm/react-diagrams',
    addonPanelInRight: true
});

addDecorator(fn => {
    Toolkit.TESTING_UID = 0;
    return fn();
});

import demo_client from './demos/client-demo-simple';
import demo_simple from './demos/demo-simple';
import demo_flow from './demos/demo-simple-flow';
import demo_performance from './demos/demo-performance';
import demo_locks from './demos/demo-locks';
import demo_grid from './demos/demo-grid';
import demo_listeners from './demos/demo-listeners';
import demo_zoom from './demos/demo-zoom-to-fit';
import demo_labels from './demos/demo-labelled-links';
import demo_dynamic_ports from './demos/demo-dynamic-ports';
import demo_alternative_linking from './demos/demo-alternative-linking';
import demo_custom_delete_keys from './demos/demo-custom_delete_keys';

storiesOf('Simple Usage', module)
    .add('Client Demo', demo_client)

Solution

  • Try passing the url as encoded one

    encodeURIComponent('http://localhost:35475/?path=/story/simple-usage--client-demo&test=123')
    

    like this

    "http%3A%2F%2Flocalhost%3A35475%2F%3Fpath%3D%2Fstory%2Fsimple-usage--client-demo%26test%3D123"