StorybookのINITIAL_VIEWPORTSをストーリに指定する

2024年7月8日

StorybookのINITIAL_VIEWPORTSのVIEWをストーリ事に指定する方法について調査

以下のようにviewportを追加すれば良いらしい

export const SidebarOnLargeMobile = Template.bind({})
SidebarOnLargeMobile.parameters = {
viewport: {
defaultViewport: 'ipad12p',
},
}

ためしにIpadPro12.9-inで指定したら適用できなかったが、ipad12pなら良かった。

一覧を探してみたところ以下の公式で定義されていた