fix(settings): fixed two IPFS gateway issues

- adds back in two bugfixes that were originally in #19283 - fixes #16871 - fixes #18140 - achieves 100% code coverage for /ui/pages/settings/security-tab - removes the npm package `valid-url`, which has not been updated in 10 years
MetaMask · Jul 31, 2023 · 3484147 · 3484147
1 parent 3b0d37c
commit 3484147
Show file tree

Hide file tree

Showing 8 changed files with 192 additions and 126 deletions.
diff --git a/app/scripts/lib/rpc-method-middleware/handlers/add-ethereum-chain.js b/app/scripts/lib/rpc-method-middleware/handlers/add-ethereum-chain.js
@@ -1,5 +1,4 @@
 import { ethErrors, errorCodes } from 'eth-rpc-errors';
-import validUrl from 'valid-url';
 import { omit } from 'lodash';
 import { ApprovalType } from '@metamask/controller-utils';
 import {
@@ -11,6 +10,7 @@ import {
   isSafeChainId,
 } from '../../../../../shared/modules/network.utils';
 import { MetaMetricsNetworkEventSource } from '../../../../../shared/constants/metametrics';
+import { isLocalhostOrHttps } from '../../util';
 
 const addEthereumChain = {
   methodNames: [MESSAGE_TYPE.ADD_ETHEREUM_CHAIN],
@@ -83,27 +83,14 @@ async function addEthereumChainHandler(
     );
   }
 
-  const isLocalhost = (strUrl) => {
-    try {
-      const url = new URL(strUrl);
-      return url.hostname === 'localhost' || url.hostname === '127.0.0.1';
-    } catch (error) {
-      return false;
-    }
-  };
-
   const firstValidRPCUrl = Array.isArray(rpcUrls)
-    ? rpcUrls.find(
-        (rpcUrl) => isLocalhost(rpcUrl) || validUrl.isHttpsUri(rpcUrl),
-      )
+    ? rpcUrls.find((rpcUrl) => isLocalhostOrHttps(rpcUrl))
     : null;
 
   const firstValidBlockExplorerUrl =
     blockExplorerUrls !== null && Array.isArray(blockExplorerUrls)
-      ? blockExplorerUrls.find(
-          (blockExplorerUrl) =>
-            isLocalhost(blockExplorerUrl) ||
-            validUrl.isHttpsUri(blockExplorerUrl),
+      ? blockExplorerUrls.find((blockExplorerUrl) =>
+          isLocalhostOrHttps(blockExplorerUrl),
         )
       : null;
 

diff --git a/app/scripts/lib/util.ts b/app/scripts/lib/util.ts
@@ -1,24 +1,23 @@
+import { AccessList } from '@ethereumjs/tx';
 import BN from 'bn.js';
 import { memoize } from 'lodash';
-import { AccessList } from '@ethereumjs/tx';
-import { CHAIN_IDS, TEST_CHAINS } from '../../../shared/constants/network';
-
 import {
-  ENVIRONMENT_TYPE_POPUP,
-  ENVIRONMENT_TYPE_NOTIFICATION,
-  ENVIRONMENT_TYPE_FULLSCREEN,
   ENVIRONMENT_TYPE_BACKGROUND,
-  PLATFORM_FIREFOX,
-  PLATFORM_OPERA,
+  ENVIRONMENT_TYPE_FULLSCREEN,
+  ENVIRONMENT_TYPE_NOTIFICATION,
+  ENVIRONMENT_TYPE_POPUP,
+  PLATFORM_BRAVE,
   PLATFORM_CHROME,
   PLATFORM_EDGE,
-  PLATFORM_BRAVE,
+  PLATFORM_FIREFOX,
+  PLATFORM_OPERA,
 } from '../../../shared/constants/app';
-import { stripHexPrefix } from '../../../shared/modules/hexstring-utils';
+import { CHAIN_IDS, TEST_CHAINS } from '../../../shared/constants/network';
 import {
   TransactionEnvelopeType,
   TransactionMeta,
 } from '../../../shared/constants/transaction';
+import { stripHexPrefix } from '../../../shared/modules/hexstring-utils';
 
 /**
  * @see {@link getEnvironmentType}
@@ -143,13 +142,13 @@ function checkAlarmExists(alarmList: { name: string }[], alarmName: string) {
 }
 
 export {
-  getPlatform,
-  getEnvironmentType,
-  hexToBn,
   BnMultiplyByFraction,
   addHexPrefix,
-  getChainType,
   checkAlarmExists,
+  getChainType,
+  getEnvironmentType,
+  getPlatform,
+  hexToBn,
 };
 
 // Taken from https://stackoverflow.com/a/1349426/3696652
@@ -235,10 +234,53 @@ export function previousValueComparator<A>(
 }
 
 export function addUrlProtocolPrefix(urlString: string) {
-  if (!urlString.match(/(^http:\/\/)|(^https:\/\/)/u)) {
-    return `https://${urlString}`;
+  let trimmed = urlString.trim();
+
+  if (trimmed.length > 0 && !trimmed.match(/(^http:\/\/)|(^https:\/\/)/u)) {
+    trimmed = `https://${trimmed}`;
+  }
+
+  if (isValidUrl(trimmed)) {
+    return trimmed;
+  }
+
+  return null;
+}
+
+export function isLocalhostOrHttps(urlString: string) {
+  try {
+    const url = new URL(urlString);
+    return (
+      url.hostname === 'localhost' ||
+      url.hostname === '127.0.0.1' ||
+      url.protocol === 'https:'
+    );
+  } catch (error) {
+    return false;
+  }
+}
+
+export function isValidUrl(urlString: string): boolean {
+  try {
+    const url = new URL(urlString);
+
+    return url.hostname.length > 0 && url.pathname.length > 0;
+  } catch (error) {
+    return false;
+  }
+}
+
+export function isWebUrl(urlString: string): boolean {
+  try {
+    const url = new URL(urlString);
+    return (
+      url.hostname.length > 0 &&
+      (url.protocol === 'https:' || url.protocol === 'http:') &&
+      url.pathname.length > 0
+    );
+  } catch (error) {
+    return false;
   }
-  return urlString;
 }
 
 interface FormattedTransactionMeta {

diff --git a/package.json b/package.json
@@ -362,7 +362,6 @@
     "single-call-balance-checker-abi": "^1.0.0",
     "unicode-confusables": "^0.1.1",
     "uuid": "^8.3.2",
-    "valid-url": "^1.0.9",
     "web3-stream-provider": "^4.0.0",
     "zxcvbn": "^4.4.2"
   },

diff --git a/ui/pages/keychains/reveal-seed.js b/ui/pages/keychains/reveal-seed.js
@@ -129,7 +129,7 @@ const RevealSeedPage = () => {
 
   const renderPasswordPromptContent = () => {
     return (
-      <form onSubmit={(event) => handleSubmit(event)}>
+      <form onSubmit={handleSubmit}>
         <Label htmlFor="password-box">{t('enterPasswordContinue')}</Label>
         <TextField
           inputProps={{

diff --git a/ui/pages/settings/networks-tab/networks-form/networks-form.js b/ui/pages/settings/networks-tab/networks-form/networks-form.js
@@ -1,3 +1,7 @@
+import classnames from 'classnames';
+import { isEqual } from 'lodash';
+import log from 'loglevel';
+import PropTypes from 'prop-types';
 import React, {
   useCallback,
   useContext,
@@ -6,12 +10,18 @@ import React, {
   useState,
 } from 'react';
 import { useDispatch } from 'react-redux';
-import PropTypes from 'prop-types';
-import validUrl from 'valid-url';
-import log from 'loglevel';
-import classnames from 'classnames';
-import { isEqual } from 'lodash';
-import { useI18nContext } from '../../../../hooks/useI18nContext';
+import { isWebUrl } from '../../../../../app/scripts/lib/util';
+import {
+  MetaMetricsEventCategory,
+  MetaMetricsEventName,
+  MetaMetricsNetworkEventSource,
+} from '../../../../../shared/constants/metametrics';
+import {
+  FEATURED_RPCS,
+  infuraProjectId,
+} from '../../../../../shared/constants/network';
+import fetchWithCache from '../../../../../shared/lib/fetch-with-cache';
+import { decimalToHex } from '../../../../../shared/modules/conversion.utils';
 import {
   isPrefixedFormattedHexString,
   isSafeChainId,
@@ -20,27 +30,17 @@ import { jsonRpcRequest } from '../../../../../shared/modules/rpc.utils';
 import ActionableMessage from '../../../../components/ui/actionable-message';
 import Button from '../../../../components/ui/button';
 import FormField from '../../../../components/ui/form-field';
+import { MetaMetricsContext } from '../../../../contexts/metametrics';
+import { getNetworkLabelKey } from '../../../../helpers/utils/i18n-helper';
+import { useI18nContext } from '../../../../hooks/useI18nContext';
+import { usePrevious } from '../../../../hooks/usePrevious';
 import {
-  setSelectedNetworkConfigurationId,
-  upsertNetworkConfiguration,
   editAndSetNetworkConfiguration,
-  showModal,
   setNewNetworkAdded,
+  setSelectedNetworkConfigurationId,
+  showModal,
+  upsertNetworkConfiguration,
 } from '../../../../store/actions';
-import fetchWithCache from '../../../../../shared/lib/fetch-with-cache';
-import { usePrevious } from '../../../../hooks/usePrevious';
-import {
-  MetaMetricsEventCategory,
-  MetaMetricsEventName,
-  MetaMetricsNetworkEventSource,
-} from '../../../../../shared/constants/metametrics';
-import {
-  infuraProjectId,
-  FEATURED_RPCS,
-} from '../../../../../shared/constants/network';
-import { decimalToHex } from '../../../../../shared/modules/conversion.utils';
-import { MetaMetricsContext } from '../../../../contexts/metametrics';
-import { getNetworkLabelKey } from '../../../../helpers/utils/i18n-helper';
 
 /**
  * Attempts to convert the given chainId to a decimal string, for display
@@ -74,11 +74,6 @@ const prefixChainId = (chainId) => {
   return prefixedChainId;
 };
 
-const isValidWhenAppended = (url) => {
-  const appendedRpc = `http://${url}`;
-  return validUrl.isWebUri(appendedRpc) && !url.match(/^https?:\/\/$/u);
-};
-
 const NetworksForm = ({
   addNewNetwork,
   restrictHeight,
@@ -208,23 +203,20 @@ const NetworksForm = ({
 
   const validateBlockExplorerURL = useCallback(
     (url) => {
-      if (!validUrl.isWebUri(url) && url !== '') {
-        let errorKey;
-        let errorMessage;
-
-        if (isValidWhenAppended(url)) {
-          errorKey = 'urlErrorMsg';
-          errorMessage = t('urlErrorMsg');
-        } else {
-          errorKey = 'invalidBlockExplorerURL';
-          errorMessage = t('invalidBlockExplorerURL');
+      if (url.length > 0 && !isWebUrl(url)) {
+        if (isWebUrl(`https://${url}`)) {
+          return {
+            key: 'urlErrorMsg',
+            msg: t('urlErrorMsg'),
+          };
         }
 
         return {
-          key: errorKey,
-          msg: errorMessage,
+          key: 'invalidBlockExplorerURL',
+          msg: t('invalidBlockExplorerURL'),
         };
       }
+
       return null;
     },
     [t],
@@ -407,7 +399,6 @@ const NetworksForm = ({
 
   const validateRPCUrl = useCallback(
     (url) => {
-      const isValidUrl = validUrl.isWebUri(url);
       const [
         {
           rpcUrl: matchingRPCUrl = null,
@@ -417,20 +408,16 @@ const NetworksForm = ({
       ] = networksToRender.filter((e) => e.rpcUrl === url);
       const { rpcUrl: selectedNetworkRpcUrl } = selectedNetwork;
 
-      if (!isValidUrl && url !== '') {
-        let errorKey;
-        let errorMessage;
-        if (isValidWhenAppended(url)) {
-          errorKey = 'urlErrorMsg';
-          errorMessage = t('urlErrorMsg');
-        } else {
-          errorKey = 'invalidRPC';
-          errorMessage = t('invalidRPC');
+      if (url.length > 0 && !isWebUrl(url)) {
+        if (isWebUrl(`https://${url}`)) {
+          return {
+            key: 'urlErrorMsg',
+            msg: t('urlErrorMsg'),
+          };
         }
-
         return {
-          key: errorKey,
-          msg: errorMessage,
+          key: 'invalidRPC',
+          msg: t('invalidRPC'),
         };
       } else if (matchingRPCUrl && matchingRPCUrl !== selectedNetworkRpcUrl) {
         return {