tests: provide regression against #344, CSS Text inline inheritance …

…override
meliorence · Jul 20, 2020 · 7c8d26a · 7c8d26a
1 parent 9702d91
commit 7c8d26a
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 2 deletions.
diff --git a/src/HTMLRenderers.js b/src/HTMLRenderers.js
@@ -34,10 +34,9 @@ export function a (htmlAttribs, children, convertedCSSStyles, passProps) {
     const onPress = (evt) => onLinkPress && htmlAttribs && htmlAttribs.href ?
         onLinkPress(evt, htmlAttribs.href, htmlAttribs) :
         undefined;
-
     if (parentWrapper === 'Text') {
         return (
-            <Text {...textProps} style={style} onPress={onPress} key={key}>
+            <Text testID="a-renderer" {...textProps} style={style} onPress={onPress} key={key}>
                 { children || data }
             </Text>
         );

diff --git a/src/__tests__/regression.344.css-inline-inheritance-override.test.js b/src/__tests__/regression.344.css-inline-inheritance-override.test.js
@@ -0,0 +1,32 @@
+import React from "react";
+import { StyleSheet } from "react-native";
+import HTML from "../index";
+import { render } from "react-native-testing-library";
+
+/**
+ * https://github.com/archriss/react-native-render-html/issues/344
+ */
+// Skipped because a fix will require an important refactoring
+// eslint-disable-next-line jest/no-disabled-tests
+describe.skip("HTML component should pass regression #344", () => {
+  it("when anchors nested in paragraphs have their tagStyles overriden by inline inheritance", () => {
+    const tagsStyles = {
+      p: {
+        color: "red",
+      },
+      a: {
+        color: "green",
+      },
+    };
+    const { getByTestId } = render(
+      <HTML
+        tagsStyles={tagsStyles}
+        html='<p><img src="https://img.com/1"/>foo<a>bar</a></p>'
+      />
+    );
+    const text = getByTestId("a-renderer");
+    expect(StyleSheet.flatten(text.props.style)).toMatchObject({
+      color: "green",
+    });
+  });
+});