Scroll preview pane for non-percentage heights

[mshaaban088]

Issues: #3326 #3341

While investigating this issue #3326, I found out that this is caused by this scrollIntoView call inside StorySource addon, which weirdly makes the entire right split panel (preview + addon panels) to scroll up whenever you go back to storysource panel after changing the viewport.

Added to that, on small screens (issue #3341), part of the viewport is hidden behind the addon's panel, that's because the iframe container is not scrollable and is less in height than the iframe

Both issues are correlated to each other though

What I did

• Make the preview pane (iframe's container) scrollable
• Make the preview pane's height same as the iframe height

How to test

Make the steps described in #3326 but without the misplacement of the story panel

Is this testable with Jest or Chromatic screenshots?
No

Does this need a new example in the kitchen sink apps?
No

Does this need an update to the documentation?
No

If your answer is yes to any of these, please make sure to include it in your PR.

[codecov]

Codecov Report

Merging #3342 into master will decrease coverage by 56.67%.
The diff coverage is 50%.

@@             Coverage Diff             @@
##           master    #3342       +/-   ##
===========================================
- Coverage    92.5%   35.82%   -56.68%     
===========================================
  Files           6      472      +466     
  Lines          40    10164    +10124     
  Branches        2      953      +951     
===========================================
+ Hits           37     3641     +3604     
- Misses          2     5904     +5902     
- Partials        1      619      +618

Impacted Files	Coverage Δ
addons/viewport/src/manager/components/Panel.js	37.26% <50%> (ø)
lib/ui/src/modules/ui/components/layout/index.js	28.18% <50%> (ø)
lib/codemod/src/transforms/move-buildin-addons.js	46.87% <0%> (ø)
addons/a11y/src/components/Report/index.js	0% <0%> (ø)
app/polymer/src/server/utils.js	0% <0%> (ø)
app/react-native/src/index.js	0% <0%> (ø)
addons/info/src/components/Node.js	94.2% <0%> (ø)
...dons/storyshots/stories/directly_required/index.js	100% <0%> (ø)
addons/knobs/src/components/types/Array.js	34.14% <0%> (ø)
lib/components/src/highlight_button.js	0% <0%> (ø)
... and 458 more

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update f72232c...fe7ca9d. Read the comment docs.