Merge branch 'master' into add-defaultTextStyle-to-support-global-textalign

Author: bas-ie

HTMLView.js

@@ -65,6 +65,7 @@ class HtmlView extends PureComponent {
     const {
       addLineBreaks,
       onLinkPress,
+      onLinkLongPress,
       stylesheet,
       renderNode,
       onError,
@@ -77,6 +78,7 @@ class HtmlView extends PureComponent {
     const opts = {
       addLineBreaks,
       linkHandler: onLinkPress,
+      linkLongPressHandler: onLinkLongPress,
       styles: {...baseStyles, ...stylesheet},
       customRenderer: renderNode,
     };
@@ -128,6 +130,7 @@ HtmlView.propTypes = {
   nodeComponentProps: PropTypes.object,
   onError: PropTypes.func,
   onLinkPress: PropTypes.func,
+  onLinkLongPress: PropTypes.func,
   paragraphBreak: PropTypes.string,
   renderNode: PropTypes.func,
   RootComponent: PropTypes.func,
@@ -142,6 +145,7 @@ HtmlView.propTypes = {
 HtmlView.defaultProps = {
   addLineBreaks: true,
   onLinkPress: url => Linking.openURL(url),
+  onLinkLongPress: null,
   onError: console.error.bind(console),
   RootComponent: View,
 };

README.md

@@ -24,6 +24,8 @@ props:
 - `value`: a string of HTML content to render
 - `onLinkPress`: a function which will be called with a url when a link is pressed.
   Passing this prop will override how links are handled (defaults to calling `Linking.openURL(url)`)
+- `onLinkLongPress`: a function which will be called with a url when a link is long pressed.
+  The default is `null`.
 - `stylesheet`: a stylesheet object keyed by tag name, which will override the
   styles applied to those respective tags.
 - `renderNode`: a custom function to render HTML nodes however you see fit. If

__tests__/HTMLView-test.js

@@ -2,7 +2,7 @@ import React from 'react';
 
 import renderer from 'react-test-renderer';
 
-import {Text} from 'react-native';
+import {StyleSheet, Text} from 'react-native';
 
 import HTMLView from '../HTMLView';
 
@@ -39,6 +39,17 @@ describe('<HTMLView/>', () => {
     ).toMatchSnapshot();
   });
 
+  it('should handle additional text nodes between list items', () => {
+    const htmlContent = `<ol>
+      <li> a </li>
+      <li> b </li>
+    </ol>`;
+
+    expect(
+      renderer.create(<HTMLView value={htmlContent} />).toJSON()
+    ).toMatchSnapshot();
+  });
+
   it('should render an <Image />, with default width/height of 1', () => {
     const imgSrc =
       'https://facebook.github.io/react-native/img/header_logo.png';
@@ -59,6 +70,21 @@ describe('<HTMLView/>', () => {
     ).toMatchSnapshot();
   });
 
+  it('should render inherited styles correctly', () => {
+    const htmlContent = '<b>RED<u>BLUE<i>GREEN</i></u></b>';
+    const stylesheet = StyleSheet.create({
+      b: {color: 'red'},
+      u: {color: 'blue'},
+      i: {color: 'green'},
+    });
+
+    expect(
+      renderer
+        .create(<HTMLView value={htmlContent} stylesheet={stylesheet} />)
+        .toJSON()
+    ).toMatchSnapshot();
+  });
+
   it('should render shoddy html including headings, links, bold, italic', () => {
     const htmlContent = `
       <div class="comment">