Test that renderTag prop works.

peterp · Apr 19, 2019 · 16b77aa · 16b77aa
1 parent 9dfe392
commit 16b77aa
Show file tree

Hide file tree

Showing 2 changed files with 85 additions and 0 deletions.
diff --git a/Tags/__tests__/Tags-tests.js b/Tags/__tests__/Tags-tests.js
@@ -1,5 +1,7 @@
 import React from "react";
 import renderer from "react-test-renderer";
+import { Text } from "react-native";
+
 import Tags from "../../";
 
 describe("Tags", () => {
@@ -18,6 +20,24 @@ describe("Tags", () => {
     expect(tree).toMatchSnapshot();
   });
 
+  describe("renderTag prop", () => {
+    it("allows me to render a custom tag with a function", () => {
+      const renderTag = jest.fn(({ tag }) => <Text key={tag}>{tag}</Text>);
+
+      const tree = renderer
+        .create(
+          <Tags
+            initialText=""
+            initialTags={["palm", "oil", "sucks"]}
+            onChangeTags={noop}
+            renderTag={renderTag}
+          />
+        )
+        .toJSON();
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
   describe("textInputProps", () => {
     const tree = renderer
       .create(

diff --git a/Tags/__tests__/__snapshots__/Tags-tests.js.snap b/Tags/__tests__/__snapshots__/Tags-tests.js.snap
@@ -165,6 +165,71 @@ exports[` 1`] = `
 </View>
 `;
 
+exports[`Tags renderTag prop allows me to render a custom tag with a function 1`] = `
+<View
+  style={
+    Array [
+      Object {
+        "alignItems": "center",
+        "flexDirection": "row",
+        "flexWrap": "wrap",
+      },
+      undefined,
+      undefined,
+    ]
+  }
+>
+  <Text>
+    palm
+  </Text>
+  <Text>
+    oil
+  </Text>
+  <Text>
+    sucks
+  </Text>
+  <View
+    style={
+      Array [
+        Object {
+          "backgroundColor": "#ccc",
+          "borderRadius": 16,
+          "flex": 1,
+          "height": 32,
+          "margin": 4,
+          "minWidth": 100,
+        },
+        undefined,
+      ]
+    }
+  >
+    <TextInput
+      allowFontScaling={true}
+      onChangeText={[Function]}
+      onSubmitEditing={[Function]}
+      rejectResponderTermination={true}
+      style={
+        Array [
+          Object {
+            "color": "rgba(0, 0, 0, 0.87)",
+            "flex": 1,
+            "fontSize": 13,
+            "height": 32,
+            "margin": 0,
+            "padding": 0,
+            "paddingLeft": 12,
+            "paddingRight": 12,
+          },
+          undefined,
+        ]
+      }
+      underlineColorAndroid="transparent"
+      value=""
+    />
+  </View>
+</View>
+`;
+
 exports[`Tags should render props correctly 1`] = `
 <View
   style={