Merge pull request #6695 from MetaMask/develop

Develop to master

CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Current Develop Branch
 
+## 6.6.1 Thu Jun 06 2019
+
+- [#6691](https://github.com/MetaMask/metamask-extension/pull/6691): Revert "Improve ENS Address Input" to fix bugs on input field on non-main networks.
+
 ## 6.6.0 Mon Jun 03 2019
 
 - [#6659](https://github.com/MetaMask/metamask-extension/pull/6659): Enable Ledger hardware wallet support on Firefox

app/manifest.json

@@ -1,7 +1,7 @@
 {
   "name": "__MSG_appName__",
   "short_name": "__MSG_appName__",
-  "version": "6.6.0",
+  "version": "6.6.1",
   "manifest_version": 2,
   "author": "https://metamask.io",
   "description": "__MSG_appDescription__",

ui/app/components/app/ens-input.js

@@ -41,15 +41,12 @@ EnsInput.prototype.onChange = function (recipient) {
       ensResolution: null,
       ensFailure: null,
       toError: null,
-      recipient,
     })
   }
 
   this.setState({
     loadingEns: true,
-    recipient,
   })
-
   this.checkName(recipient)
 }
 
@@ -59,7 +56,6 @@ EnsInput.prototype.render = function () {
     list: 'addresses',
     onChange: this.onChange.bind(this),
     qrScanner: true,
-    recipient: (this.state || {}).recipient,
   })
   return h('div', {
     style: { width: '100%', position: 'relative' },
@@ -83,21 +79,19 @@ EnsInput.prototype.componentDidMount = function () {
 
 EnsInput.prototype.lookupEnsName = function (recipient) {
   const { ensResolution } = this.state
-  recipient = recipient.trim()
 
   log.info(`ENS attempting to resolve name: ${recipient}`)
-  this.ens.lookup(recipient)
+  this.ens.lookup(recipient.trim())
   .then((address) => {
     if (address === ZERO_ADDRESS) throw new Error(this.context.t('noAddressForName'))
     if (address !== ensResolution) {
       this.setState({
         loadingEns: false,
         ensResolution: address,
-        nickname: recipient,
+        nickname: recipient.trim(),
         hoverText: address + '\n' + this.context.t('clickCopy'),
         ensFailure: false,
         toError: null,
-        recipient,
       })
     }
   })
@@ -107,11 +101,11 @@ EnsInput.prototype.lookupEnsName = function (recipient) {
       ensResolution: recipient,
       ensFailure: true,
       toError: null,
-      recipient: null,
     }
     if (isValidENSAddress(recipient) && reason.message === 'ENS name not defined.') {
       setStateObj.hoverText = this.context.t('ensNameNotFound')
       setStateObj.toError = 'ensNameNotFound'
+      setStateObj.ensFailure = false
     } else {
       log.error(reason)
       setStateObj.hoverText = reason.message
@@ -134,7 +128,7 @@ EnsInput.prototype.componentDidUpdate = function (prevProps, prevState) {
   }
   if (prevState && ensResolution && this.props.onChange &&
       ensResolution !== prevState.ensResolution) {
-    this.props.onChange({ toAddress: ensResolution, recipient: state.recipient, nickname, toError: state.toError, toWarning: state.toWarning })
+    this.props.onChange({ toAddress: ensResolution, nickname, toError: state.toError, toWarning: state.toWarning })
   }
 }
 

ui/app/css/itcss/components/send.scss

@@ -773,43 +773,7 @@
     }
   }
 
-  &__to-autocomplete {
-    display: flex;
-    flex-direction: column;
-    z-index: 1025;
-    position: relative;
-    height: 54px;
-    width: 100%;
-    border: 1px solid $alto;
-    border-radius: 4px;
-    background-color: $white;
-    color: $tundora;
-    padding: 0 10px;
-    font-family: Roboto;
-    line-height: 21px;
-
-    &__input {
-      font-size: 16px;
-      height: 100%;
-      border: none;
-    }
-
-    &__resolved {
-      font-size: 12px;
-      text-overflow: ellipsis;
-      overflow: hidden;
-      white-space: nowrap;
-      height: 30px;
-      cursor: pointer;
-
-      + .send-v2__to-autocomplete__qr-code {
-        top: 2px;
-        right: 0;
-      }
-    }
-  }
-
-  &__memo-text-area, &__hex-data {
+  &__to-autocomplete, &__memo-text-area, &__hex-data {
     &__input {
       z-index: 1025;
       position: relative;

ui/app/pages/send/to-autocomplete/to-autocomplete.js

@@ -1,7 +1,6 @@
 const Component = require('react').Component
 const PropTypes = require('prop-types')
 const h = require('react-hyperscript')
-const copyToClipboard = require('copy-to-clipboard')
 const inherits = require('util').inherits
 const AccountListItem = require('../account-list-item/account-list-item.component').default
 const connect = require('react-redux').connect
@@ -94,34 +93,24 @@ ToAutoComplete.prototype.componentDidUpdate = function (nextProps) {
 ToAutoComplete.prototype.render = function () {
   const {
     to,
-    recipient,
     dropdownOpen,
     onChange,
     inError,
     qrScanner,
   } = this.props
 
-  const isRecipientToDiff = recipient && recipient !== to
-
-  return h('div.send-v2__to-autocomplete', {style: {
-      borderColor: inError ? 'red' : null,
-    }}, [
+  return h('div.send-v2__to-autocomplete', {}, [
 
     h(`input.send-v2__to-autocomplete__input${qrScanner ? '.with-qr' : ''}`, {
       placeholder: this.context.t('recipientAddress'),
       className: inError ? `send-v2__error-border` : '',
-      value: recipient,
+      value: to,
       onChange: event => onChange(event.target.value),
       onFocus: event => this.handleInputEvent(event),
+      style: {
+        borderColor: inError ? 'red' : null,
+      },
     }),
-    isRecipientToDiff && h(Tooltip, {title: this.context.t('copyToClipboard')},
-        h('div.send-v2__to-autocomplete__resolved', {
-          onClick: (event) => {
-            event.preventDefault()
-            event.stopPropagation()
-            copyToClipboard(to)
-          },
-    }, to)),
     qrScanner && h(Tooltip, {
       title: this.context.t('scanQrCode'),
       position: 'bottom',