Fix screenshot generation and comparison

Change-type: patch Signed-off-by: Stevche Radevski <stevche@balena.io>
balena-io-modules · Jun 24, 2019 · 03b96f2 · 03b96f2
1 parent 12522d3
commit 03b96f2
Show file tree

Hide file tree

Showing 123 changed files with 10 additions and 5 deletions.
diff --git a/.storybook/config.js b/.storybook/config.js
@@ -13,11 +13,8 @@ const GlobalStyle = createGlobalStyle([], {
     lineHeight: 1.5,
     margin: 0,
     fontFamily: theme.font,
-    height: '100%',
-    background: 'white'
-  },
-  html: {
-    height: '100%'
+    background: 'white',
+    webkitFontSmoothing: 'antialiased'
   }
 })
 

diff --git a/.storybook/preview-head.html b/.storybook/preview-head.html
@@ -11,4 +11,12 @@
     }, 50);
   });
 }
+
+// hack to hide page viewport resolution on page (for screenshot purposes)
+// See https://github.com/tsuyoshiwada/storybook-chrome-screenshot/issues/58
+const $style = window.top.document.createElement('style');
+  $style.innerHTML = `iframe + div {
+    display: none !important;
+  }`;
+  window.top.document.body.appendChild($style);
 </script>
diff --git a/__screenshots__/BetaForm-Custom-submit-button-text.png b/__screenshots__/BetaForm-Custom-submit-button-text.png
diff --git a/__screenshots__/BetaForm-Extra-widgets.png b/__screenshots__/BetaForm-Extra-widgets.png
diff --git a/__screenshots__/BetaForm-Group-titles.png b/__screenshots__/BetaForm-Group-titles.png
diff --git a/__screenshots__/BetaForm-Help-Text.png b/__screenshots__/BetaForm-Help-Text.png
diff --git a/__screenshots__/BetaForm-Hidden-submit-button.png b/__screenshots__/BetaForm-Hidden-submit-button.png
diff --git a/__screenshots__/BetaForm-Preset-values.png b/__screenshots__/BetaForm-Preset-values.png
diff --git a/__screenshots__/BetaForm-Simple.png b/__screenshots__/BetaForm-Simple.png
diff --git a/__screenshots__/BetaForm-UI-schema.png b/__screenshots__/BetaForm-UI-schema.png
diff --git a/__screenshots__/BetaForm-Warnings.png b/__screenshots__/BetaForm-Warnings.png
diff --git a/__screenshots__/BetaForm-patternProperties.png b/__screenshots__/BetaForm-patternProperties.png
diff --git a/__screenshots__/CoreAlert-Emphasized.png b/__screenshots__/CoreAlert-Emphasized.png
diff --git a/__screenshots__/CoreAlert-Plaintext.png b/__screenshots__/CoreAlert-Plaintext.png
diff --git a/__screenshots__/CoreAlert-Standard.png b/__screenshots__/CoreAlert-Standard.png
diff --git a/__screenshots__/CoreArcSlider-Background-color.png b/__screenshots__/CoreArcSlider-Background-color.png
diff --git a/__screenshots__/CoreArcSlider-Change-handler.png b/__screenshots__/CoreArcSlider-Change-handler.png
diff --git a/__screenshots__/CoreArcSlider-Fill-color.png b/__screenshots__/CoreArcSlider-Fill-color.png
diff --git a/__screenshots__/CoreArcSlider-Label.png b/__screenshots__/CoreArcSlider-Label.png
diff --git a/__screenshots__/CoreArcSlider-Standard.png b/__screenshots__/CoreArcSlider-Standard.png
diff --git a/__screenshots__/CoreBadge-Controlled.png b/__screenshots__/CoreBadge-Controlled.png
diff --git a/__screenshots__/CoreBadge-Small.png b/__screenshots__/CoreBadge-Small.png
diff --git a/__screenshots__/CoreBadge-Standard.png b/__screenshots__/CoreBadge-Standard.png
diff --git a/__screenshots__/CoreBadge-Xsmall.png b/__screenshots__/CoreBadge-Xsmall.png
diff --git a/__screenshots__/CoreBanner-BackgoundImage.png b/__screenshots__/CoreBanner-BackgoundImage.png
diff --git a/__screenshots__/CoreBox-Standard.png b/__screenshots__/CoreBox-Standard.png
diff --git a/__screenshots__/CoreCard-Standard.png b/__screenshots__/CoreCard-Standard.png
diff --git a/__screenshots__/CoreCard-Title.png b/__screenshots__/CoreCard-Title.png
diff --git a/__screenshots__/CoreCard-With-Header.png b/__screenshots__/CoreCard-With-Header.png
diff --git a/__screenshots__/CoreCard-With-rows.png b/__screenshots__/CoreCard-With-rows.png
diff --git a/__screenshots__/CoreContainer-Center-Text.png b/__screenshots__/CoreContainer-Center-Text.png
diff --git a/__screenshots__/CoreContainer-Standard.png b/__screenshots__/CoreContainer-Standard.png
diff --git a/__screenshots__/CoreDivider-Standard.png b/__screenshots__/CoreDivider-Standard.png
diff --git a/__screenshots__/CoreFlex-Flex-direction.png b/__screenshots__/CoreFlex-Flex-direction.png
diff --git a/__screenshots__/CoreFlex-Flex-property-on-children.png b/__screenshots__/CoreFlex-Flex-property-on-children.png
diff --git a/__screenshots__/CoreFlex-Flex-wrap.png b/__screenshots__/CoreFlex-Flex-wrap.png
diff --git a/__screenshots__/CoreFlex-Justify.png b/__screenshots__/CoreFlex-Justify.png
diff --git a/__screenshots__/CoreFlex-Standard.png b/__screenshots__/CoreFlex-Standard.png
diff --git a/__screenshots__/CoreImg-Standard.png b/__screenshots__/CoreImg-Standard.png
diff --git a/__screenshots__/CoreInput-Emphasized.png b/__screenshots__/CoreInput-Emphasized.png
diff --git a/__screenshots__/CoreInput-Input-types.png b/__screenshots__/CoreInput-Input-types.png
diff --git a/__screenshots__/CoreInput-Monospace.png b/__screenshots__/CoreInput-Monospace.png
diff --git a/__screenshots__/CoreInput-Standard.png b/__screenshots__/CoreInput-Standard.png
diff --git a/__screenshots__/CoreNavbar-Standard.png b/__screenshots__/CoreNavbar-Standard.png
diff --git a/__screenshots__/CoreProgressBar-Emphasized.png b/__screenshots__/CoreProgressBar-Emphasized.png
diff --git a/__screenshots__/CoreProgressBar-Standard.png b/__screenshots__/CoreProgressBar-Standard.png
diff --git a/__screenshots__/CoreSearch-Dark.png b/__screenshots__/CoreSearch-Dark.png
diff --git a/__screenshots__/CoreSearch-Disabled.png b/__screenshots__/CoreSearch-Disabled.png
diff --git a/__screenshots__/CoreSearch-Placeholder.png b/__screenshots__/CoreSearch-Placeholder.png
diff --git a/__screenshots__/CoreSearch-Standard.png b/__screenshots__/CoreSearch-Standard.png
diff --git a/__screenshots__/CoreSwatches-All.png b/__screenshots__/CoreSwatches-All.png
diff --git a/__screenshots__/CoreTable-Anchor-Rows-with-Checkboxes.png b/__screenshots__/CoreTable-Anchor-Rows-with-Checkboxes.png
diff --git a/__screenshots__/CoreTable-Anchor-Rows.png b/__screenshots__/CoreTable-Anchor-Rows.png
diff --git a/__screenshots__/CoreTable-Checkboxes.png b/__screenshots__/CoreTable-Checkboxes.png
diff --git a/__screenshots__/CoreTable-Conditional-classes.png b/__screenshots__/CoreTable-Conditional-classes.png
diff --git a/__screenshots__/CoreTable-Highlighted-rows.png b/__screenshots__/CoreTable-Highlighted-rows.png
diff --git a/__screenshots__/CoreTable-Multiple-Row-Prefix.png b/__screenshots__/CoreTable-Multiple-Row-Prefix.png
diff --git a/__screenshots__/CoreTable-Pager.png b/__screenshots__/CoreTable-Pager.png
diff --git a/__screenshots__/CoreTable-Row-Click.png b/__screenshots__/CoreTable-Row-Click.png
diff --git a/__screenshots__/CoreTable-Row-Prefix.png b/__screenshots__/CoreTable-Row-Prefix.png
diff --git a/__screenshots__/CoreTable-Standard.png b/__screenshots__/CoreTable-Standard.png
diff --git a/__screenshots__/CoreTable-Updating-data-in-a-table.png b/__screenshots__/CoreTable-Updating-data-in-a-table.png
diff --git a/__screenshots__/CoreTerminal-Non-interactive.png b/__screenshots__/CoreTerminal-Non-interactive.png
diff --git a/__screenshots__/CoreTerminal-Persistent.png b/__screenshots__/CoreTerminal-Persistent.png
diff --git a/__screenshots__/CoreTerminal-Standard.png b/__screenshots__/CoreTerminal-Standard.png
diff --git a/__screenshots__/CoreTextarea-AutoRows.png b/__screenshots__/CoreTextarea-AutoRows.png
diff --git a/__screenshots__/CoreTextarea-MaxRows.png b/__screenshots__/CoreTextarea-MaxRows.png
diff --git a/__screenshots__/CoreTextarea-MinRows.png b/__screenshots__/CoreTextarea-MinRows.png
diff --git a/__screenshots__/CoreTextarea-Monospace.png b/__screenshots__/CoreTextarea-Monospace.png
diff --git a/__screenshots__/CoreTextarea-Standard.png b/__screenshots__/CoreTextarea-Standard.png
diff --git a/__screenshots__/CoreTooltips-Click.png b/__screenshots__/CoreTooltips-Click.png
diff --git a/__screenshots__/CoreTooltips-Standard.png b/__screenshots__/CoreTooltips-Standard.png
diff --git a/__screenshots__/CoreTooltips-Styled-tooltips.png b/__screenshots__/CoreTooltips-Styled-tooltips.png
diff --git a/__screenshots__/CoreTooltips-Supported-Elements.png b/__screenshots__/CoreTooltips-Supported-Elements.png
diff --git a/__screenshots__/CoreTypography-Headings.png b/__screenshots__/CoreTypography-Headings.png
diff --git a/__screenshots__/CoreTypography-Link.png b/__screenshots__/CoreTypography-Link.png
diff --git a/__screenshots__/CoreTypography-Txt.png b/__screenshots__/CoreTypography-Txt.png
diff --git a/__screenshots__/ExtraMarkdown-Standard.png b/__screenshots__/ExtraMarkdown-Standard.png
diff --git a/__screenshots__/ExtraMermaid-Standard.png b/__screenshots__/ExtraMermaid-Standard.png
diff --git a/__screenshots__/NextButton-Active.png b/__screenshots__/NextButton-Active.png
diff --git a/__screenshots__/NextButton-Disabled.png b/__screenshots__/NextButton-Disabled.png
diff --git a/__screenshots__/NextButton-Icon-only.png b/__screenshots__/NextButton-Icon-only.png
diff --git a/__screenshots__/NextButton-Link.png b/__screenshots__/NextButton-Link.png
diff --git a/__screenshots__/NextButton-Outline.png b/__screenshots__/NextButton-Outline.png
diff --git a/__screenshots__/NextButton-Plain.png b/__screenshots__/NextButton-Plain.png
diff --git a/__screenshots__/NextButton-Standard.png b/__screenshots__/NextButton-Standard.png
diff --git a/__screenshots__/NextButton-Underline.png b/__screenshots__/NextButton-Underline.png
diff --git a/__screenshots__/NextButton-Width.png b/__screenshots__/NextButton-Width.png
diff --git a/__screenshots__/NextButton-With-icon.png b/__screenshots__/NextButton-With-icon.png
diff --git a/__screenshots__/NextButtonGroup-Standard.png b/__screenshots__/NextButtonGroup-Standard.png
diff --git a/__screenshots__/NextCheckbox-Standard.png b/__screenshots__/NextCheckbox-Standard.png
diff --git a/__screenshots__/NextCheckbox-Toggle.png b/__screenshots__/NextCheckbox-Toggle.png
diff --git a/__screenshots__/NextDropDownButton-Alignment.png b/__screenshots__/NextDropDownButton-Alignment.png
diff --git a/__screenshots__/NextDropDownButton-Bordered-List.png b/__screenshots__/NextDropDownButton-Bordered-List.png
diff --git a/__screenshots__/NextDropDownButton-Divider.png b/__screenshots__/NextDropDownButton-Divider.png
diff --git a/__screenshots__/NextDropDownButton-Joined.png b/__screenshots__/NextDropDownButton-Joined.png
diff --git a/__screenshots__/NextDropDownButton-No-List-Formatting.png b/__screenshots__/NextDropDownButton-No-List-Formatting.png
diff --git a/__screenshots__/NextDropDownButton-Only-Caret-Icon.png b/__screenshots__/NextDropDownButton-Only-Caret-Icon.png
diff --git a/__screenshots__/NextDropDownButton-Outline-+-Joined.png b/__screenshots__/NextDropDownButton-Outline-+-Joined.png
diff --git a/__screenshots__/NextDropDownButton-Outline.png b/__screenshots__/NextDropDownButton-Outline.png
diff --git a/__screenshots__/NextDropDownButton-Standard.png b/__screenshots__/NextDropDownButton-Standard.png
diff --git a/__screenshots__/NextFilters-Button-props.png b/__screenshots__/NextFilters-Button-props.png
diff --git a/__screenshots__/NextFilters-Dark.png b/__screenshots__/NextFilters-Dark.png
diff --git a/__screenshots__/NextFilters-Disabled.png b/__screenshots__/NextFilters-Disabled.png
diff --git a/__screenshots__/NextFilters-Render-modes.png b/__screenshots__/NextFilters-Render-modes.png
diff --git a/__screenshots__/NextFilters-Standard.png b/__screenshots__/NextFilters-Standard.png
diff --git a/__screenshots__/NextModal-Nested-Modals.png b/__screenshots__/NextModal-Nested-Modals.png
diff --git a/__screenshots__/NextModal-Open-Modal-Demo.png b/__screenshots__/NextModal-Open-Modal-Demo.png
diff --git a/__screenshots__/NextModal-Overflow.png b/__screenshots__/NextModal-Overflow.png
diff --git a/__screenshots__/NextModal-With-Tooltip.png b/__screenshots__/NextModal-With-Tooltip.png
diff --git a/__screenshots__/NextPager-Standard.png b/__screenshots__/NextPager-Standard.png
diff --git a/__screenshots__/NextRadioButton-Standard.png b/__screenshots__/NextRadioButton-Standard.png
diff --git a/__screenshots__/NextRadioButtonGroup-Standard.png b/__screenshots__/NextRadioButtonGroup-Standard.png
diff --git a/__screenshots__/NextSelect-Advanced.png b/__screenshots__/NextSelect-Advanced.png
diff --git a/__screenshots__/NextSelect-Standard.png b/__screenshots__/NextSelect-Standard.png
diff --git a/__screenshots__/NextSelect-States.png b/__screenshots__/NextSelect-States.png
diff --git a/__screenshots__/NextTabs-Standard.png b/__screenshots__/NextTabs-Standard.png
diff --git a/__screenshots__/NextTextWithCopy-Always-showing-the-copy-icon.png b/__screenshots__/NextTextWithCopy-Always-showing-the-copy-icon.png
diff --git a/__screenshots__/NextTextWithCopy-Code.png b/__screenshots__/NextTextWithCopy-Code.png
diff --git a/__screenshots__/NextTextWithCopy-Inside-clickable-element.png b/__screenshots__/NextTextWithCopy-Inside-clickable-element.png
diff --git a/__screenshots__/NextTextWithCopy-Standard.png b/__screenshots__/NextTextWithCopy-Standard.png
diff --git a/__screenshots__/NextTextWithCopy-Wrapping-text.png b/__screenshots__/NextTextWithCopy-Wrapping-text.png
diff --git a/__screenshots__/ToolsJSON-Schema-Validator-Draft-6.png b/__screenshots__/ToolsJSON-Schema-Validator-Draft-6.png