Add tests

vydimitrov · Mar 14, 2023 · 458b7a6 · 458b7a6
1 parent 3990de7
commit 458b7a6
Show file tree

Hide file tree

Showing 4 changed files with 871 additions and 63 deletions.
diff --git a/packages/mobile/src/CountdownCircleTimer.test.tsx b/packages/mobile/src/CountdownCircleTimer.test.tsx
@@ -42,6 +42,18 @@ describe('CountdownCircleTimer', () => {
     expect(tree).toMatchSnapshot()
   })
 
+  it('renders with isGrowing prop when it is set', () => {
+    const tree = renderer
+      .create(
+        <CountdownCircleTimer {...fixture} isPlaying>
+          {({ remainingTime }) => <Text>{remainingTime}</Text>}
+        </CountdownCircleTimer>
+      )
+      .toJSON()
+
+    expect(tree).toMatchSnapshot()
+  })
+
   it('starts the timer from value provided in initialRemainingTime', () => {
     const { getByText } = render(
       <CountdownCircleTimer

diff --git a/packages/mobile/src/__snapshots__/CountdownCircleTimer.test.tsx.snap b/packages/mobile/src/__snapshots__/CountdownCircleTimer.test.tsx.snap
@@ -158,6 +158,97 @@ exports[`CountdownCircleTimer renders with different trail stroke width 1`] = `
 </View>
 `;
 
+exports[`CountdownCircleTimer renders with isGrowing prop when it is set 1`] = `
+<View
+  style={
+    Object {
+      "height": 180,
+      "position": "relative",
+      "width": 180,
+    }
+  }
+>
+  <RNSVGSvgView
+    bbHeight={180}
+    bbWidth={180}
+    focusable={false}
+    height={180}
+    style={
+      Array [
+        Object {
+          "backgroundColor": "transparent",
+          "borderWidth": 0,
+        },
+        Object {
+          "flex": 0,
+          "height": 180,
+          "width": 180,
+        },
+      ]
+    }
+    width={180}
+  >
+    <RNSVGGroup>
+      <RNSVGPath
+        d="m 90,6 a 84,84 0 1,0 0,168 a 84,84 0 1,0 0,-168"
+        fill={null}
+        propList={
+          Array [
+            "fill",
+            "stroke",
+            "strokeWidth",
+          ]
+        }
+        stroke={4292467161}
+        strokeWidth={12}
+      />
+      <RNSVGPath
+        d="m 90,6 a 84,84 0 1,0 0,168 a 84,84 0 1,0 0,-168"
+        fill={null}
+        propList={
+          Array [
+            "fill",
+            "stroke",
+            "strokeWidth",
+            "strokeDasharray",
+            "strokeDashoffset",
+            "strokeLinecap",
+          ]
+        }
+        stroke={4289379276}
+        strokeDasharray={
+          Array [
+            527.7875658030853,
+            527.7875658030853,
+          ]
+        }
+        strokeDashoffset={null}
+        strokeLinecap={1}
+        strokeWidth={12}
+      />
+    </RNSVGGroup>
+  </RNSVGSvgView>
+  <View
+    style={
+      Object {
+        "alignItems": "center",
+        "display": "flex",
+        "height": "100%",
+        "justifyContent": "center",
+        "left": 0,
+        "position": "absolute",
+        "top": 0,
+        "width": "100%",
+      }
+    }
+  >
+    <Text>
+      1
+    </Text>
+  </View>
+</View>
+`;
+
 exports[`CountdownCircleTimer renders with single color 1`] = `
 <View
   style={

diff --git a/packages/web/src/CountdownCircleTimer.test.tsx b/packages/web/src/CountdownCircleTimer.test.tsx
@@ -85,6 +85,13 @@ describe('CountdownCircleTimer', () => {
     )
   })
 
+  it('sets stroke-dashoffset to the circle length when the isGrowing prop is true', async () => {
+    render(<CountdownCircleTimer {...fixture} isGrowing />)
+
+    const path = getAnimatingPath()
+    expect(path).toHaveAttribute('stroke-dashoffset', '527.7875658030853')
+  })
+
   it('sets trail stroke width', () => {
     render(<CountdownCircleTimer {...fixture} trailStrokeWidth={14} />)