Viewport addon not working as expected

Describe the bug After registering the addon it’s icon shows up in the storybook window but the behavior is odd. Whenever I try to chose a viewport I end up with the same thing.

To Reproduce Steps to reproduce the behavior:

1. Install the addon yarn add -D @storybook/addon-viewport
2. Register it in addons.js

import '@storybook/addon-viewport/register';

1. Create a story:

import React from 'react';
import { storiesOf } from '@storybook/react';

import ActionDialog from './index';

storiesOf('ActionDialog', module).add('default', () => (
  <ActionDialog>Dialog Content</ActionDialog>
));

1. Run storybook

Expected behavior The viewport setting resizes the viewport as shown in the print in the Readme.

Actual behavior With no breakpoints selected (this is correct)

With any breakpoint selected (in this case, iphone6)

Notice that it changes the size of the viewport (see scrollbar on the right) but not to the expected size.

System:

• OS: Ubuntu 16.04
• Device: Desktop
• Browser: chrome
• Framework: react
• Addons: breakpoint
• Version: 5.0.6

[Armanio]

Guys, I apologize: it’s my mistake, I fixed zoom and broke background addon. I create PR to fix my past mistakes. 🔝

[Armanio]

I’ll check it today. Give me a few hours. 👍