Fix tests.

Author: novykh

src/components/tabs/__snapshots__/tabs.test.js.snap

@@ -17,62 +17,60 @@ exports[`Tabs states  * should render uncontrolled 1`] = `
   justify-content: start;
   padding: 0 2px;
   color: #526161;
-  border-bottom: 1px solid #DBE1E1;
+  border-bottom: 1px solid #E4E8E8;
 }
 
 .c2 {
   display: flex;
-  flex: 1 0 auto;
   flex-direction: row;
   align-items: center;
   justify-content: center;
+  padding: 0 24px;
   color: #526161;
 }
 
 .c3 {
   white-space: nowrap;
-  border-bottom: 4px solid #42B861;
+  border-bottom: 1px solid #42B861;
   box-sizing: border-box;
-  min-width: 80px;
+  border-radius: 4px 4px 0 0;
   max-width: 208px;
-  height: 48px;
-  color: #526161;
-  font-weight: bold;
+  height: 32px;
   cursor: pointer;
   opacity: 1;
-  background: transparent;
+  background: #F1FFF7;
   pointer-events: auto;
+  margin-bottom: -1px;
 }
 
 .c3:hover {
-  border-bottom: 4px solid #00AB44;
+  border-bottom: 1px solid #00AB44;
 }
 
 .c3>span {
-  font-weight: bold;
+  color: #00AB44;
 }
 
 .c4 {
   white-space: nowrap;
-  border-bottom: 4px solid rgba(255,255,255,0.0);
+  border-bottom: 1px solid #E4E8E8;
   box-sizing: border-box;
-  min-width: 80px;
+  border-radius: 4px 4px 0 0;
   max-width: 208px;
-  height: 48px;
-  color: #526161;
-  font-weight: normal;
+  height: 32px;
   cursor: pointer;
   opacity: 1;
-  background: transparent;
+  background: #F6F7F7;
   pointer-events: auto;
+  margin-bottom: -1px;
 }
 
 .c4:hover {
-  border-bottom: 4px solid #00AB44;
+  border-bottom: 1px solid #00AB44;
 }
 
 .c4>span {
-  font-weight: normal;
+  color: #708585;
 }
 
 <div
@@ -88,36 +86,36 @@ exports[`Tabs states  * should render uncontrolled 1`] = `
     <div
       alignitems="center"
       class="c2 c3"
-      flex="grow"
       justifycontent="center"
       label="hi"
+      padding="0,6"
     >
       hi
     </div>
     <div
       alignitems="center"
       class="c2 c4"
-      flex="grow"
       justifycontent="center"
       label="Hi again"
+      padding="0,6"
     >
       Hi again
     </div>
     <div
       alignitems="center"
       class="c2 c4"
-      flex="grow"
       justifycontent="center"
       label="Bye"
+      padding="0,6"
     >
       Bye
     </div>
     <div
       alignitems="center"
       class="c2 c4"
-      flex="grow"
       justifycontent="center"
       label="Bye Bye"
+      padding="0,6"
     >
       Bye Bye
     </div>

src/components/tabs/tabs.test.js

@@ -20,15 +20,14 @@ describe("Tabs states", () => {
     const tabs = container.firstChild
     expect(tabs).toMatchSnapshot()
 
-    expect(getByText("hi")).toHaveStyleRule("font-weight", "bold")
     expect(queryByText("Hello")).toBeInTheDocument()
     expect(queryByText("Hello again")).not.toBeInTheDocument()
     expect(queryByText("Goodbye")).not.toBeInTheDocument()
     expect(queryByText("Fairwell")).not.toBeInTheDocument()
 
     const tab = getByText("Bye Bye")
     fireEvent.click(tab)
-    expect(tab).toHaveStyleRule("font-weight", "bold")
+
     expect(queryByText("Hello")).not.toBeInTheDocument()
     expect(queryByText("Fairwell")).toBeInTheDocument()
   })
@@ -55,13 +54,11 @@ describe("Tabs states", () => {
 
     expect(queryByText("Hello")).not.toBeInTheDocument()
     expect(queryByText("Hello again")).not.toBeInTheDocument()
-    expect(getByText("Bye")).toHaveStyleRule("font-weight", "bold")
     expect(queryByText("Goodbye")).toBeInTheDocument()
     expect(queryByText("Fairwell")).not.toBeInTheDocument()
 
     const tab = getByText("Hi again")
     fireEvent.click(tab)
-    expect(tab).toHaveStyleRule("font-weight", "bold")
     expect(onChange).toBeCalledWith(1)
     expect(queryByText("Goodbye")).not.toBeInTheDocument()
     expect(queryByText("Hello again")).toBeInTheDocument()
@@ -81,12 +78,10 @@ describe("Tabs states", () => {
     const { queryByText, getByText } = renderWithProviders(<Component />)
 
     expect(queryByText("Hello")).not.toBeInTheDocument()
-    expect(getByText("Hi again")).toHaveStyleRule("font-weight", "bold")
     expect(queryByText("Hello again")).toBeInTheDocument()
 
     const tab = getByText("hi")
     fireEvent.click(tab)
-    expect(tab).toHaveStyleRule("font-weight", "normal")
     expect(queryByText("Hello")).not.toBeInTheDocument()
     expect(queryByText("Hello again")).toBeInTheDocument()
   })

src/components/templates/mixins/height.test.js

@@ -14,10 +14,12 @@ it("renders min max", () => {
   expect(height({ theme, height: { min: "20rem", max: "45rem" } })).toBe(`
       min-height: 20rem;
       max-height: 45rem;
+      
     `)
   expect(height({ theme, height: { min: 1, max: 2 } })).toBe(`
       min-height: 4px;
       max-height: 8px;
+      
     `)
 })