Merge pull request from GHSA-w5xj-p53v-pg3f

* improve browser * Update package.json
MetaMask · Jul 7, 2020 · d61cd75 · d61cd75
1 parent c8d4ad7
commit d61cd75
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 24 deletions.
diff --git a/app/components/UI/Navbar/index.js b/app/components/UI/Navbar/index.js
@@ -460,15 +460,16 @@ export function getBrowserViewNavbarOptions(navigation) {
 	let isHttps = false;
 
 	const isHomepage = url => getHost(url) === getHost(HOMEPAGE_URL);
+	const error = navigation.getParam('error', '');
 
 	if (url && !isHomepage(url)) {
 		isHttps = url && url.toLowerCase().substr(0, 6) === 'https:';
 		const urlObj = new URL(url);
-		hostname = urlObj.hostname.toLowerCase().replace('www.', '');
+		hostname = urlObj.hostname.toLowerCase().replace(/^www./, '');
 		if (isGatewayUrl(urlObj) && url.search(`${AppConstants.IPFS_OVERRIDE_PARAM}=false`) === -1) {
 			const ensUrl = navigation.getParam('currentEnsName', '');
 			if (ensUrl) {
-				hostname = ensUrl.toLowerCase().replace('www.', '');
+				hostname = ensUrl.toLowerCase().replace(/^www./, '');
 			}
 		}
 	} else {
@@ -491,7 +492,9 @@ export function getBrowserViewNavbarOptions(navigation) {
 				/>
 			</TouchableOpacity>
 		),
-		headerTitle: <NavbarBrowserTitle navigation={navigation} url={url} hostname={hostname} https={isHttps} />,
+		headerTitle: (
+			<NavbarBrowserTitle error={!!error} navigation={navigation} url={url} hostname={hostname} https={isHttps} />
+		),
 		headerRight: (
 			<View style={styles.browserRightButton}>
 				<AccountRightButton />

diff --git a/app/components/UI/NavbarBrowserTitle/index.js b/app/components/UI/NavbarBrowserTitle/index.js
@@ -74,7 +74,11 @@ class NavbarBrowserTitle extends PureComponent {
 		/**
 		 * Boolean that specifies if it is a secure website
 		 */
-		https: PropTypes.bool
+		https: PropTypes.bool,
+		/**
+		 * Boolean that specifies if there is an error
+		 */
+		error: PropTypes.bool
 	};
 
 	onTitlePress = () => {
@@ -103,16 +107,17 @@ class NavbarBrowserTitle extends PureComponent {
 	}
 
 	render = () => {
-		const { https, network, hostname } = this.props;
+		const { https, network, hostname, error } = this.props;
 		const color = (Networks[network.provider.type] && Networks[network.provider.type].color) || null;
 		const name = this.getNetworkName(network);
 
 		return (
 			<TouchableOpacity onPress={this.onTitlePress} style={styles.wrapper}>
 				<View style={styles.currentUrlWrapper}>
-					{https ? <Icon name="lock" size={14} style={styles.lockIcon} /> : null}
+					{https && !error ? <Icon name="lock" size={14} style={styles.lockIcon} /> : null}
 					<Text
 						numberOfLines={1}
+						ellipsizeMode={'head'}
 						style={[styles.currentUrl, Device.isAndroid() ? styles.currentUrlAndroid : {}]}
 					>
 						{hostname}

diff --git a/app/components/Views/BrowserTab/index.js b/app/components/Views/BrowserTab/index.js
@@ -1287,16 +1287,7 @@ export class BrowserTab extends PureComponent {
 				}
 
 				case 'NAV_CHANGE': {
-					const { url, title } = data.payload;
-					this.setState({
-						inputValue: url,
-						autocompletInputValue: url,
-						currentPageTitle: title,
-						forwardEnabled: false
-					});
-					this.setState({ lastUrlBeforeHome: null });
-					this.props.navigation.setParams({ url: data.payload.url, silent: true, showUrlModal: false });
-					this.updateTabInfo(data.payload.url);
+					// This event is not necessary since it is handled by the onLoadEnd now
 					break;
 				}
 
@@ -1326,7 +1317,7 @@ export class BrowserTab extends PureComponent {
 		return true;
 	};
 
-	onPageChange = ({ url }) => {
+	onPageChange = url => {
 		if (this.isHomepage(url)) {
 			this.refreshHomeScripts();
 		}
@@ -1386,6 +1377,7 @@ export class BrowserTab extends PureComponent {
 
 		this.updateTabInfo(inputValue);
 		this.setState({
+			url,
 			fullHostname,
 			inputValue,
 			autocompleteInputValue: inputValue,
@@ -1395,7 +1387,7 @@ export class BrowserTab extends PureComponent {
 	};
 
 	formatHostname(hostname) {
-		return hostname.toLowerCase().replace('www.', '');
+		return hostname.toLowerCase().replace(/^www./, '');
 	}
 
 	onURLChange = inputValue => {
@@ -1406,7 +1398,9 @@ export class BrowserTab extends PureComponent {
 		this.setState({ progress });
 	};
 
-	onLoadEnd = () => {
+	onLoadEnd = ({ nativeEvent }) => {
+		if (nativeEvent.loading) return;
+
 		// Wait for the title, then store the visit
 		setTimeout(() => {
 			this.props.addToBrowserHistory({
@@ -1424,14 +1418,33 @@ export class BrowserTab extends PureComponent {
 
 		const { current } = this.webview;
 		// Inject favorites on the homepage
-		if (this.isHomepage() && current) {
+		if (this.isHomepage(nativeEvent.url) && current) {
 			const js = this.state.homepageScripts;
 			current.injectJavaScript(js);
 		}
+
+		// Onloadstart does not fire when a website url has changes, e.g. example.com/ex#user1 to example.com/ex#user2. So this is needed for those cases.
+		const urlObj = new URL(nativeEvent.url);
+		if (urlObj.hostname === this.state.fullHostname && nativeEvent.url !== this.state.inputValue) {
+			const { url, title } = nativeEvent;
+			this.setState({
+				url,
+				inputValue: url,
+				autocompletInputValue: url,
+				currentPageTitle: title,
+				forwardEnabled: false
+			});
+			this.setState({ lastUrlBeforeHome: null });
+			this.props.navigation.setParams({ url: nativeEvent.url, silent: true, showUrlModal: false });
+			this.updateTabInfo(nativeEvent.url);
+		}
 	};
 
 	onError = ({ nativeEvent: errorInfo }) => {
 		Logger.log(errorInfo);
+		this.props.navigation.setParams({
+			error: true
+		});
 		this.setState({ lastError: errorInfo });
 	};
 
@@ -1814,6 +1827,7 @@ export class BrowserTab extends PureComponent {
 	onLoadStart = async ({ nativeEvent }) => {
 		// Handle the scenario when going back
 		// from an ENS name
+		this.props.navigation.setParams({ error: false });
 		if (nativeEvent.navigationType === 'backforward' && nativeEvent.url === this.state.inputValue) {
 			setTimeout(() => this.goBack(), 500);
 		} else if (nativeEvent.url.indexOf(this.props.ipfsGateway) !== -1) {
@@ -1843,6 +1857,8 @@ export class BrowserTab extends PureComponent {
 			const origin = new URL(nativeEvent.url).origin;
 			this.initializeBackgroundBridge(origin, true);
 		}
+
+		this.onPageChange(nativeEvent.url);
 	};
 
 	canGoForward = () => this.state.forwardEnabled;
@@ -1912,7 +1928,6 @@ export class BrowserTab extends PureComponent {
 							onLoadEnd={this.onLoadEnd}
 							onError={this.onError}
 							onMessage={this.onMessage}
-							onNavigationStateChange={this.onPageChange}
 							ref={this.webview}
 							source={{ uri: url }}
 							style={styles.webview}

diff --git a/package.json b/package.json
@@ -158,7 +158,7 @@
     "react-native-v8": "^0.62.2-patch.1",
     "react-native-vector-icons": "6.4.2",
     "react-native-view-shot": "^3.1.2",
-    "react-native-webview": "git+ssh://git@github.com/MetaMask/react-native-webview.git#408df176e6fe7c00aa05c2fddb4054968330e8a1",
+    "react-native-webview": "git+ssh://git@github.com/MetaMask/react-native-webview.git#931ae99a0f80a650c958e9d2e39e4ed0e68d95a7",
     "react-navigation": "4.0.10",
     "react-navigation-drawer": "1.4.0",
     "react-navigation-stack": "1.7.3",

diff --git a/yarn.lock b/yarn.lock
@@ -10587,9 +10587,9 @@ react-native-view-shot@^3.1.2:
   resolved "https://registry.yarnpkg.com/react-native-view-shot/-/react-native-view-shot-3.1.2.tgz#8c8e84c67a4bc8b603e697dbbd59dbc9b4f84825"
   integrity sha512-9u9fPtp6a52UMoZ/UCPrCjKZk8tnkI9To0Eh6yYnLKFEGkRZ7Chm6DqwDJbYJHeZrheCCopaD5oEOnRqhF4L2Q==
 
-"react-native-webview@git+ssh://git@github.com/MetaMask/react-native-webview.git#408df176e6fe7c00aa05c2fddb4054968330e8a1":
+"react-native-webview@git+ssh://git@github.com/MetaMask/react-native-webview.git#ab1dcef79467ec299df9784850674ba6230253ce":
   version "7.0.5"
-  resolved "git+ssh://git@github.com/MetaMask/react-native-webview.git#408df176e6fe7c00aa05c2fddb4054968330e8a1"
+  resolved "git+ssh://git@github.com/MetaMask/react-native-webview.git#ab1dcef79467ec299df9784850674ba6230253ce"
   dependencies:
     escape-string-regexp "1.0.5"
     invariant "2.2.4"