[WIP] FEI-5589: Experiment with CSS modules - DO NOT REVIEW #3770
node-ci-pr.yml
on: pull_request
Matrix: Prime node_modules cache for primary configuration
Matrix: Check for .changeset entries for all changed files
Matrix: Publish npm snapshot
Matrix: Check build sizes
Matrix: Lint
Matrix: Test
Annotations
24 errors
Lint (ubuntu-latest, 20.x):
__docs__/wonder-blocks-core/view.stories.tsx#L6
'color' is defined but never used. Allowed unused vars must match /^_*$/u
|
Lint (ubuntu-latest, 20.x):
__docs__/wonder-blocks-core/view.stories.tsx#L6
'spacing' is defined but never used. Allowed unused vars must match /^_*$/u
|
Lint (ubuntu-latest, 20.x)
Process completed with exit code 1.
|
LabeledTextField › light prop is passed to textfield:
packages/wonder-blocks-form/src/components/__tests__/labeled-text-field.test.tsx#L399
expect(element).toHaveStyle()
- Expected
- boxShadow: 0px 0px 0px 1px #1865f2, 0px 0px 0px 2px #ffffff;
at Object.toHaveStyle (packages/wonder-blocks-form/src/components/__tests__/labeled-text-field.test.tsx:399:27)
|
Link › external link that opens in a new tab › render external icon when `target=_blank` and link is external:
packages/wonder-blocks-link/src/components/__tests__/link.test.tsx#L386
expect(element).toHaveStyle()
- Expected
- maskImage: url(arrow-square-out-bold.svg);
at Object.toHaveStyle (packages/wonder-blocks-link/src/components/__tests__/link.test.tsx:386:26)
|
Link › start and end icons › render icon with link when startIcon prop is passed in:
packages/wonder-blocks-link/src/components/__tests__/link.test.tsx#L445
expect(element).toHaveStyle()
- Expected
- maskImage: url(plus-bold.svg);
at Object.toHaveStyle (packages/wonder-blocks-link/src/components/__tests__/link.test.tsx:445:26)
|
Link › start and end icons › startIcon prop passed down correctly:
packages/wonder-blocks-link/src/components/__tests__/link.test.tsx#L474
expect(element).toHaveStyle()
- Expected
- maskImage: url(plus-bold.svg);
at Object.toHaveStyle (packages/wonder-blocks-link/src/components/__tests__/link.test.tsx:474:26)
|
Link › start and end icons › render icon with link when endIcon prop is passed in:
packages/wonder-blocks-link/src/components/__tests__/link.test.tsx#L492
expect(element).toHaveStyle()
- Expected
- maskImage: url(plus-bold.svg);
at Object.toHaveStyle (packages/wonder-blocks-link/src/components/__tests__/link.test.tsx:492:26)
|
Link › start and end icons › render endIcon instead of default externalIcon when `target='_blank' and link is external`:
packages/wonder-blocks-link/src/components/__tests__/link.test.tsx#L541
expect(element).toHaveStyle()
- Expected
- maskImage: url(plus-bold.svg);
at Object.toHaveStyle (packages/wonder-blocks-link/src/components/__tests__/link.test.tsx:541:26)
|
Link › start and end icons › endIcon prop passed down correctly:
packages/wonder-blocks-link/src/components/__tests__/link.test.tsx#L556
expect(element).toHaveStyle()
- Expected
- maskImage: url(plus-bold.svg);
at Object.toHaveStyle (packages/wonder-blocks-link/src/components/__tests__/link.test.tsx:556:26)
|
FieldHeading › should render a LabelMedium when the 'label' prop is a I18nInlineMarkup:
packages/wonder-blocks-form/src/components/__tests__/field-heading.test.tsx#L197
expect(element).toHaveStyle()
- Expected
- font-size: 16px;
at Object.toHaveStyle (packages/wonder-blocks-form/src/components/__tests__/field-heading.test.tsx:197:23)
|
FieldHeading › should render a LabelSmall when the 'description' prop is a I18nInlineMarkup:
packages/wonder-blocks-form/src/components/__tests__/field-heading.test.tsx#L215
expect(element).toHaveStyle()
- Expected
- font-size: 14px;
at Object.toHaveStyle (packages/wonder-blocks-form/src/components/__tests__/field-heading.test.tsx:215:29)
|
TooltipTail › #render › should render a spacer when show is false:
packages/wonder-blocks-tooltip/src/components/__tests__/tooltip-tail.test.tsx#L118
expect(received).toMatchInlineSnapshot(snapshot)
Snapshot name: `TooltipTail #render should render a spacer when show is false 1`
- Snapshot - 1
+ Received + 1
@@ -5,9 +5,9 @@
style="align-items: stretch; border-width: 0px; border-style: solid; box-sizing: border-box; display: flex; flex-direction: column; margin: 0px; padding: 0px; position: relative; z-index: 0; min-height: 0; min-width: 0; pointer-events: none; top: -1px; width: 40px; height: 20px;"
>
<div
aria-hidden="true"
class=""
- style="align-items: stretch; border-width: 0px; border-style: solid; box-sizing: border-box; display: flex; flex-direction: column; margin: 0px; padding: 0px; position: relative; z-index: 0; min-height: 0; min-width: 0; width: 12px; flex-basis: 12px; flex-shrink: 0;"
+ style="--strut-size: 12px;"
/>
</div>
</div>
at Object.toMatchInlineSnapshot (packages/wonder-blocks-tooltip/src/components/__tests__/tooltip-tail.test.tsx:118:31)
|
Test (ubuntu-latest, 20.x, 2/2)
The job was canceled because "ubuntu-latest_20_x_1_2" failed.
|
Button › <Link tabIndex={-1}>:
packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx#L32
expect(received).toMatchSnapshot()
Snapshot name: `Button <Link tabIndex={-1}> 1`
- Snapshot - 46
+ Received + 0
@@ -12,60 +12,14 @@
onMouseUp={[Function]}
onTouchCancel={[Function]}
onTouchEnd={[Function]}
onTouchStart={[Function]}
role="button"
- style={
- {
- "::MozFocusInner": {
- "border": 0,
- },
- ":focus": {
- "WebkitTapHighlightColor": "rgba(0,0,0,0)",
- },
- "alignItems": "center",
- "background": "#1865f2",
- "border": "none",
- "borderRadius": 4,
- "boxSizing": "border-box",
- "color": "#ffffff",
- "cursor": "pointer",
- "display": "inline-flex",
- "height": 40,
- "justifyContent": "center",
- "margin": 0,
- "outline": "none",
- "paddingBottom": 0,
- "paddingLeft": 16,
- "paddingRight": 16,
- "paddingTop": 0,
- "position": "relative",
- "textDecoration": "none",
- "touchAction": "manipulation",
- "userSelect": "none",
- }
- }
tabIndex={-1}
type="button"
>
<span
className=""
- style={
- {
- "MozOsxFontSmoothing": "grayscale",
- "WebkitFontSmoothing": "antialiased",
- "alignItems": "center",
- "display": "inline-block",
- "fontFamily": "Lato, "Noto Sans", sans-serif",
- "fontSize": 16,
- "fontWeight": 700,
- "lineHeight": "20px",
- "overflow": "hidden",
- "pointerEvents": "none",
- "textOverflow": "ellipsis",
- "whiteSpace": "nowrap",
- }
- }
>
Click me
</span>
</button>
at toMatchSnapshot (packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx:32:22)
|
Button › <Link tabIndex={0}>:
packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx#L32
expect(received).toMatchSnapshot()
Snapshot name: `Button <Link tabIndex={0}> 1`
- Snapshot - 46
+ Received + 0
@@ -12,60 +12,14 @@
onMouseUp={[Function]}
onTouchCancel={[Function]}
onTouchEnd={[Function]}
onTouchStart={[Function]}
role="button"
- style={
- {
- "::MozFocusInner": {
- "border": 0,
- },
- ":focus": {
- "WebkitTapHighlightColor": "rgba(0,0,0,0)",
- },
- "alignItems": "center",
- "background": "#1865f2",
- "border": "none",
- "borderRadius": 4,
- "boxSizing": "border-box",
- "color": "#ffffff",
- "cursor": "pointer",
- "display": "inline-flex",
- "height": 40,
- "justifyContent": "center",
- "margin": 0,
- "outline": "none",
- "paddingBottom": 0,
- "paddingLeft": 16,
- "paddingRight": 16,
- "paddingTop": 0,
- "position": "relative",
- "textDecoration": "none",
- "touchAction": "manipulation",
- "userSelect": "none",
- }
- }
tabIndex={0}
type="button"
>
<span
className=""
- style={
- {
- "MozOsxFontSmoothing": "grayscale",
- "WebkitFontSmoothing": "antialiased",
- "alignItems": "center",
- "display": "inline-block",
- "fontFamily": "Lato, "Noto Sans", sans-serif",
- "fontSize": 16,
- "fontWeight": 700,
- "lineHeight": "20px",
- "overflow": "hidden",
- "pointerEvents": "none",
- "textOverflow": "ellipsis",
- "whiteSpace": "nowrap",
- }
- }
>
Click me
</span>
</button>
at toMatchSnapshot (packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx:32:22)
|
Button › <Link tabIndex={1}>:
packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx#L32
expect(received).toMatchSnapshot()
Snapshot name: `Button <Link tabIndex={1}> 1`
- Snapshot - 46
+ Received + 0
@@ -12,60 +12,14 @@
onMouseUp={[Function]}
onTouchCancel={[Function]}
onTouchEnd={[Function]}
onTouchStart={[Function]}
role="button"
- style={
- {
- "::MozFocusInner": {
- "border": 0,
- },
- ":focus": {
- "WebkitTapHighlightColor": "rgba(0,0,0,0)",
- },
- "alignItems": "center",
- "background": "#1865f2",
- "border": "none",
- "borderRadius": 4,
- "boxSizing": "border-box",
- "color": "#ffffff",
- "cursor": "pointer",
- "display": "inline-flex",
- "height": 40,
- "justifyContent": "center",
- "margin": 0,
- "outline": "none",
- "paddingBottom": 0,
- "paddingLeft": 16,
- "paddingRight": 16,
- "paddingTop": 0,
- "position": "relative",
- "textDecoration": "none",
- "touchAction": "manipulation",
- "userSelect": "none",
- }
- }
tabIndex={1}
type="button"
>
<span
className=""
- style={
- {
- "MozOsxFontSmoothing": "grayscale",
- "WebkitFontSmoothing": "antialiased",
- "alignItems": "center",
- "display": "inline-block",
- "fontFamily": "Lato, "Noto Sans", sans-serif",
- "fontSize": 16,
- "fontWeight": 700,
- "lineHeight": "20px",
- "overflow": "hidden",
- "pointerEvents": "none",
- "textOverflow": "ellipsis",
- "whiteSpace": "nowrap",
- }
- }
>
Click me
</span>
</button>
at toMatchSnapshot (packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx:32:22)
|
ButtonCore › kind:primary color:default size:medium light:true disabled:
packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx#L75
expect(received).toMatchSnapshot()
Snapshot name: `ButtonCore kind:primary color:default size:medium light:true disabled 1`
- Snapshot - 47
+ Received + 1
@@ -1,9 +1,9 @@
<button
aria-disabled={true}
aria-label=""
- className=""
+ className="default.module.css"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
@@ -13,60 +13,14 @@
onMouseUp={[Function]}
onTouchCancel={[Function]}
onTouchEnd={[Function]}
onTouchStart={[Function]}
role="button"
- style={
- {
- "::MozFocusInner": {
- "border": 0,
- },
- ":focus": {
- "boxShadow": "0 0 0 1px rgba(33,36,44,0.32), 0 0 0 3px #b5cefb",
- },
- "alignItems": "center",
- "background": "#b5cefb",
- "border": "none",
- "borderRadius": 4,
- "boxSizing": "border-box",
- "color": "#1865f2",
- "cursor": "default",
- "display": "inline-flex",
- "height": 40,
- "justifyContent": "center",
- "margin": 0,
- "outline": "none",
- "paddingBottom": 0,
- "paddingLeft": 16,
- "paddingRight": 16,
- "paddingTop": 0,
- "position": "relative",
- "textDecoration": "none",
- "touchAction": "manipulation",
- "userSelect": "none",
- }
- }
tabIndex={-1}
type="button"
>
<span
className=""
- style={
- {
- "MozOsxFontSmoothing": "grayscale",
- "WebkitFontSmoothing": "antialiased",
- "alignItems": "center",
- "display": "inline-block",
- "fontFamily": "Lato, "Noto Sans", sans-serif",
- "fontSize": 16,
- "fontWeight": 700,
- "lineHeight": "20px",
- "overflow": "hidden",
- "pointerEvents": "none",
- "textOverflow": "ellipsis",
- "whiteSpace": "nowrap",
- }
- }
>
Click me
</span>
</button>
at Object.toMatchSnapshot (packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx:75:42)
|
ButtonCore › kind:primary color:default size:medium light:true focused:
packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx#L75
expect(received).toMatchSnapshot()
Snapshot name: `ButtonCore kind:primary color:default size:medium light:true focused 1`
- Snapshot - 48
+ Received + 1
@@ -1,9 +1,9 @@
<button
aria-disabled={false}
aria-label=""
- className=""
+ className="default.module.css"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
@@ -13,61 +13,14 @@
onMouseUp={[Function]}
onTouchCancel={[Function]}
onTouchEnd={[Function]}
onTouchStart={[Function]}
role="button"
- style={
- {
- "::MozFocusInner": {
- "border": 0,
- },
- ":focus": {
- "WebkitTapHighlightColor": "rgba(0,0,0,0)",
- },
- "alignItems": "center",
- "background": "#ffffff",
- "border": "none",
- "borderRadius": 4,
- "boxShadow": "0 0 0 1px #0b2149, 0 0 0 3px #ffffff",
- "boxSizing": "border-box",
- "color": "#1865f2",
- "cursor": "pointer",
- "display": "inline-flex",
- "height": 40,
- "justifyContent": "center",
- "margin": 0,
- "outline": "none",
- "paddingBottom": 0,
- "paddingLeft": 16,
- "paddingRight": 16,
- "paddingTop": 0,
- "position": "relative",
- "textDecoration": "none",
- "touchAction": "manipulation",
- "userSelect": "none",
- }
- }
tabIndex={0}
type="button"
>
<span
className=""
- style={
- {
- "MozOsxFontSmoothing": "grayscale",
- "WebkitFontSmoothing": "antialiased",
- "alignItems": "center",
- "display": "inline-block",
- "fontFamily": "Lato, "Noto Sans", sans-serif",
- "fontSize": 16,
- "fontWeight": 700,
- "lineHeight": "20px",
- "overflow": "hidden",
- "pointerEvents": "none",
- "textOverflow": "ellipsis",
- "whiteSpace": "nowrap",
- }
- }
>
Click me
</span>
</button>
at Object.toMatchSnapshot (packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx:75:42)
|
ButtonCore › kind:primary color:default size:medium light:true hovered:
packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx#L75
expect(received).toMatchSnapshot()
Snapshot name: `ButtonCore kind:primary color:default size:medium light:true hovered 1`
- Snapshot - 48
+ Received + 1
@@ -1,9 +1,9 @@
<button
aria-disabled={false}
aria-label=""
- className=""
+ className="default.module.css"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
@@ -13,61 +13,14 @@
onMouseUp={[Function]}
onTouchCancel={[Function]}
onTouchEnd={[Function]}
onTouchStart={[Function]}
role="button"
- style={
- {
- "::MozFocusInner": {
- "border": 0,
- },
- ":focus": {
- "WebkitTapHighlightColor": "rgba(0,0,0,0)",
- },
- "alignItems": "center",
- "background": "#ffffff",
- "border": "none",
- "borderRadius": 4,
- "boxShadow": "0 0 0 1px #0b2149, 0 0 0 3px #ffffff",
- "boxSizing": "border-box",
- "color": "#1865f2",
- "cursor": "pointer",
- "display": "inline-flex",
- "height": 40,
- "justifyContent": "center",
- "margin": 0,
- "outline": "none",
- "paddingBottom": 0,
- "paddingLeft": 16,
- "paddingRight": 16,
- "paddingTop": 0,
- "position": "relative",
- "textDecoration": "none",
- "touchAction": "manipulation",
- "userSelect": "none",
- }
- }
tabIndex={0}
type="button"
>
<span
className=""
- style={
- {
- "MozOsxFontSmoothing": "grayscale",
- "WebkitFontSmoothing": "antialiased",
- "alignItems": "center",
- "display": "inline-block",
- "fontFamily": "Lato, "Noto Sans", sans-serif",
- "fontSize": 16,
- "fontWeight": 700,
- "lineHeight": "20px",
- "overflow": "hidden",
- "pointerEvents": "none",
- "textOverflow": "ellipsis",
- "whiteSpace": "nowrap",
- }
- }
>
Click me
</span>
</button>
at Object.toMatchSnapshot (packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx:75:42)
|
ButtonCore › kind:primary color:default size:medium light:true pressed:
packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx#L75
expect(received).toMatchSnapshot()
Snapshot name: `ButtonCore kind:primary color:default size:medium light:true pressed 1`
- Snapshot - 48
+ Received + 1
@@ -1,9 +1,9 @@
<button
aria-disabled={false}
aria-label=""
- className=""
+ className="default.module.css"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
@@ -13,61 +13,14 @@
onMouseUp={[Function]}
onTouchCancel={[Function]}
onTouchEnd={[Function]}
onTouchStart={[Function]}
role="button"
- style={
- {
- "::MozFocusInner": {
- "border": 0,
- },
- ":focus": {
- "WebkitTapHighlightColor": "rgba(0,0,0,0)",
- },
- "alignItems": "center",
- "background": "#b5cefb",
- "border": "none",
- "borderRadius": 4,
- "boxShadow": "0 0 0 1px #0b2149, 0 0 0 3px #b5cefb",
- "boxSizing": "border-box",
- "color": "#1b50b3",
- "cursor": "pointer",
- "display": "inline-flex",
- "height": 40,
- "justifyContent": "center",
- "margin": 0,
- "outline": "none",
- "paddingBottom": 0,
- "paddingLeft": 16,
- "paddingRight": 16,
- "paddingTop": 0,
- "position": "relative",
- "textDecoration": "none",
- "touchAction": "manipulation",
- "userSelect": "none",
- }
- }
tabIndex={0}
type="button"
>
<span
className=""
- style={
- {
- "MozOsxFontSmoothing": "grayscale",
- "WebkitFontSmoothing": "antialiased",
- "alignItems": "center",
- "display": "inline-block",
- "fontFamily": "Lato, "Noto Sans", sans-serif",
- "fontSize": 16,
- "fontWeight": 700,
- "lineHeight": "20px",
- "overflow": "hidden",
- "pointerEvents": "none",
- "textOverflow": "ellipsis",
- "whiteSpace": "nowrap",
- }
- }
>
Click me
</span>
</button>
at Object.toMatchSnapshot (packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx:75:42)
|
ButtonCore › kind:primary color:default size:medium light:false disabled:
packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx#L75
expect(received).toMatchSnapshot()
Snapshot name: `ButtonCore kind:primary color:default size:medium light:false disabled 1`
- Snapshot - 47
+ Received + 1
@@ -1,9 +1,9 @@
<button
aria-disabled={true}
aria-label=""
- className=""
+ className="default.module.css"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
@@ -13,60 +13,14 @@
onMouseUp={[Function]}
onTouchCancel={[Function]}
onTouchEnd={[Function]}
onTouchStart={[Function]}
role="button"
- style={
- {
- "::MozFocusInner": {
- "border": 0,
- },
- ":focus": {
- "boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px rgba(33,36,44,0.32)",
- },
- "alignItems": "center",
- "background": "rgba(33,36,44,0.32)",
- "border": "none",
- "borderRadius": 4,
- "boxSizing": "border-box",
- "color": "rgba(255,255,255,0.64)",
- "cursor": "default",
- "display": "inline-flex",
- "height": 40,
- "justifyContent": "center",
- "margin": 0,
- "outline": "none",
- "paddingBottom": 0,
- "paddingLeft": 16,
- "paddingRight": 16,
- "paddingTop": 0,
- "position": "relative",
- "textDecoration": "none",
- "touchAction": "manipulation",
- "userSelect": "none",
- }
- }
tabIndex={-1}
type="button"
>
<span
className=""
- style={
- {
- "MozOsxFontSmoothing": "grayscale",
- "WebkitFontSmoothing": "antialiased",
- "alignItems": "center",
- "display": "inline-block",
- "fontFamily": "Lato, "Noto Sans", sans-serif",
- "fontSize": 16,
- "fontWeight": 700,
- "lineHeight": "20px",
- "overflow": "hidden",
- "pointerEvents": "none",
- "textOverflow": "ellipsis",
- "whiteSpace": "nowrap",
- }
- }
>
Click me
</span>
</button>
at Object.toMatchSnapshot (packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx:75:42)
|
ButtonCore › kind:primary color:default size:medium light:false focused:
packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx#L75
expect(received).toMatchSnapshot()
Snapshot name: `ButtonCore kind:primary color:default size:medium light:false focused 1`
- Snapshot - 48
+ Received + 1
@@ -1,9 +1,9 @@
<button
aria-disabled={false}
aria-label=""
- className=""
+ className="default.module.css"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
@@ -13,61 +13,14 @@
onMouseUp={[Function]}
onTouchCancel={[Function]}
onTouchEnd={[Function]}
onTouchStart={[Function]}
role="button"
- style={
- {
- "::MozFocusInner": {
- "border": 0,
- },
- ":focus": {
- "WebkitTapHighlightColor": "rgba(0,0,0,0)",
- },
- "alignItems": "center",
- "background": "#1865f2",
- "border": "none",
- "borderRadius": 4,
- "boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1865f2",
- "boxSizing": "border-box",
- "color": "#ffffff",
- "cursor": "pointer",
- "display": "inline-flex",
- "height": 40,
- "justifyContent": "center",
- "margin": 0,
- "outline": "none",
- "paddingBottom": 0,
- "paddingLeft": 16,
- "paddingRight": 16,
- "paddingTop": 0,
- "position": "relative",
- "textDecoration": "none",
- "touchAction": "manipulation",
- "userSelect": "none",
- }
- }
tabIndex={0}
type="button"
>
<span
className=""
- style={
- {
- "MozOsxFontSmoothing": "grayscale",
- "WebkitFontSmoothing": "antialiased",
- "alignItems": "center",
- "display": "inline-block",
- "fontFamily": "Lato, "Noto Sans", sans-serif",
- "fontSize": 16,
- "fontWeight": 700,
- "lineHeight": "20px",
- "overflow": "hidden",
- "pointerEvents": "none",
- "textOverflow": "ellipsis",
- "whiteSpace": "nowrap",
- }
- }
>
Click me
</span>
</button>
at Object.toMatchSnapshot (packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx:75:42)
|
ButtonCore › kind:primary color:default size:medium light:false hovered:
packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx#L75
expect(received).toMatchSnapshot()
Snapshot name: `ButtonCore kind:primary color:default size:medium light:false hovered 1`
- Snapshot - 48
+ Received + 1
@@ -1,9 +1,9 @@
<button
aria-disabled={false}
aria-label=""
- className=""
+ className="default.module.css"
onBlur={[Function]}
onClick={[Function]}
onFocus={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
@@ -13,61 +13,14 @@
onMouseUp={[Function]}
onTouchCancel={[Function]}
onTouchEnd={[Function]}
onTouchStart={[Function]}
role="button"
- style={
- {
- "::MozFocusInner": {
- "border": 0,
- },
- ":focus": {
- "WebkitTapHighlightColor": "rgba(0,0,0,0)",
- },
- "alignItems": "center",
- "background": "#1865f2",
- "border": "none",
- "borderRadius": 4,
- "boxShadow": "0 0 0 1px #ffffff, 0 0 0 3px #1865f2",
- "boxSizing": "border-box",
- "color": "#ffffff",
- "cursor": "pointer",
- "display": "inline-flex",
- "height": 40,
- "justifyContent": "center",
- "margin": 0,
- "outline": "none",
- "paddingBottom": 0,
- "paddingLeft": 16,
- "paddingRight": 16,
- "paddingTop": 0,
- "position": "relative",
- "textDecoration": "none",
- "touchAction": "manipulation",
- "userSelect": "none",
- }
- }
tabIndex={0}
type="button"
>
<span
className=""
- style={
- {
- "MozOsxFontSmoothing": "grayscale",
- "WebkitFontSmoothing": "antialiased",
- "alignItems": "center",
- "display": "inline-block",
- "fontFamily": "Lato, "Noto Sans", sans-serif",
- "fontSize": 16,
- "fontWeight": 700,
- "lineHeight": "20px",
- "overflow": "hidden",
- "pointerEvents": "none",
- "textOverflow": "ellipsis",
- "whiteSpace": "nowrap",
- }
- }
>
Click me
</span>
</button>
at Object.toMatchSnapshot (packages/wonder-blocks-button/src/__tests__/custom-snapshot.test.tsx:75:42)
|