Skip to content
This repository has been archived by the owner on Dec 11, 2019. It is now read-only.

Commit

Permalink
Merge pull request #9031 from brave/9017
Browse files Browse the repository at this point in the history 
Check input value before set it
  • Loading branch information
@bsclifton
bsclifton authored May 25, 2017
2 parents 4289b3d + d30d5ff commit 5e79349
Show file tree
Hide file tree
Showing 5 changed files with 76 additions and 25 deletions.
78 changes: 60 additions & 18 deletions app/renderer/components/autofill/autofillAddressPanel.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,11 +17,18 @@ const {
CommonFormLarge,
CommonFormSection,
CommonFormTitle,
CommonFormTextbox,
CommonFormButtonWrapper,
commonFormStyles
} = require('../common/commonForm')

const commonForm = css(
commonStyles.formControl,
commonStyles.textbox,
commonStyles.textbox__outlineable,
commonStyles.isCommonForm,
commonFormStyles.input__box
)

class AutofillAddressPanel extends ImmutableComponent {
constructor () {
super()
Expand All @@ -41,46 +48,73 @@ class AutofillAddressPanel extends ImmutableComponent {
onNameChange (e) {
let currentDetail = this.props.currentDetail
currentDetail = currentDetail.set('name', e.target.value)
if (this.nameOnAddress.value !== e.target.value) {
this.nameOnAddress.value = e.target.value
}
windowActions.setAutofillAddressDetail(currentDetail, this.props.originalDetail)
}
onOrganizationChange (e) {
let currentDetail = this.props.currentDetail
currentDetail = currentDetail.set('organization', e.target.value)
if (this.organization.value !== e.target.value) {
this.organization.value = e.target.value
}
windowActions.setAutofillAddressDetail(currentDetail, this.props.originalDetail)
}
onStreetAddressChange (e) {
let currentDetail = this.props.currentDetail
currentDetail = currentDetail.set('streetAddress', e.target.value)
if (this.streetAddress.value !== e.target.value) {
this.streetAddress.value = e.target.value
}
windowActions.setAutofillAddressDetail(currentDetail, this.props.originalDetail)
}
onCityChange (e) {
let currentDetail = this.props.currentDetail
currentDetail = currentDetail.set('city', e.target.value)
windowActions.setAutofillAddressDetail(currentDetail, this.props.originalDetail)
if (this.city.value !== e.target.value) {
this.city.value = e.target.value
}
}
onStateChange (e) {
let currentDetail = this.props.currentDetail
currentDetail = currentDetail.set('state', e.target.value)
if (this.state.value !== e.target.value) {
this.state.value = e.target.value
}
windowActions.setAutofillAddressDetail(currentDetail, this.props.originalDetail)
}
onPostalCodeChange (e) {
let currentDetail = this.props.currentDetail
currentDetail = currentDetail.set('postalCode', e.target.value)
if (this.postalCode.value !== e.target.value) {
this.postalCode.value = e.target.value
}
windowActions.setAutofillAddressDetail(currentDetail, this.props.originalDetail)
}
onCountryChange (e) {
let currentDetail = this.props.currentDetail
currentDetail = currentDetail.set('country', e.target.value)
if (this.country.value !== e.target.value) {
this.country.value = e.target.value
}
windowActions.setAutofillAddressDetail(currentDetail, this.props.originalDetail)
}
onPhoneChange (e) {
let currentDetail = this.props.currentDetail
currentDetail = currentDetail.set('phone', e.target.value)
if (this.phone.value !== e.target.value) {
this.phone.value = e.target.value
}
windowActions.setAutofillAddressDetail(currentDetail, this.props.originalDetail)
}
onEmailChange (e) {
let currentDetail = this.props.currentDetail
currentDetail = currentDetail.set('email', e.target.value)
if (this.email.value !== e.target.value) {
this.email.value = e.target.value
}
windowActions.setAutofillAddressDetail(currentDetail, this.props.originalDetail)
}
onKeyDown (e) {
Expand Down Expand Up @@ -111,6 +145,15 @@ class AutofillAddressPanel extends ImmutableComponent {
}
componentDidMount () {
this.nameOnAddress.focus()
this.nameOnAddress.value = this.props.currentDetail.get('name') || ''
this.organization.value = this.props.currentDetail.get('organization') || ''
this.streetAddress.value = this.props.currentDetail.get('streetAddress') || ''
this.city.value = this.props.currentDetail.get('city') || ''
this.state.value = this.props.currentDetail.get('state') || ''
this.postalCode.value = this.props.currentDetail.get('postalCode') || ''
this.country.value = this.props.currentDetail.get('country') || ''
this.phone.value = this.props.currentDetail.get('phone') || ''
this.email.value = this.props.currentDetail.get('email') || ''
}
render () {
return <Dialog onHide={this.props.onHide} testId='autofillAddressPanel' isClickDismiss>
Expand Down Expand Up @@ -138,55 +181,54 @@ class AutofillAddressPanel extends ImmutableComponent {
)}
data-test-id='nameOnAddress'
spellCheck='false' onKeyDown={this.onKeyDown} onChange={this.onNameChange}
value={this.props.currentDetail.get('name') || ''}
ref={(nameOnAddress) => { this.nameOnAddress = nameOnAddress }} />
<div className={css(commonFormStyles.input__marginRow)}>
<CommonFormTextbox
<input className={commonForm}
data-test-id='organization'
spellCheck='false' onKeyDown={this.onKeyDown} onChange={this.onOrganizationChange}
value={this.props.currentDetail.get('organization')} />
ref={(organization) => { this.organization = organization }} />
</div>
<div className={css(commonFormStyles.input__marginRow)}>
<CommonFormTextbox
<input className={commonForm}
data-test-id='streetAddress'
spellCheck='false' onKeyDown={this.onKeyDown} onChange={this.onStreetAddressChange}
value={this.props.currentDetail.get('streetAddress')} />
ref={(streetAddress) => { this.streetAddress = streetAddress }} />
</div>
<div className={css(commonFormStyles.input__marginRow)}>
<CommonFormTextbox
<input className={commonForm}
data-test-id='city'
spellCheck='false' onKeyDown={this.onKeyDown} onChange={this.onCityChange}
value={this.props.currentDetail.get('city')} />
ref={(city) => { this.city = city }} />
</div>
<div className={css(commonFormStyles.input__marginRow)}>
<CommonFormTextbox
<input className={commonForm}
data-test-id='state'
spellCheck='false' onKeyDown={this.onKeyDown} onChange={this.onStateChange}
value={this.props.currentDetail.get('state')} />
ref={(state) => { this.state = state }} />
</div>
<div className={css(commonFormStyles.input__marginRow)}>
<CommonFormTextbox
<input className={commonForm}
data-test-id='postalCode'
spellCheck='false' onKeyDown={this.onKeyDown} onChange={this.onPostalCodeChange}
value={this.props.currentDetail.get('postalCode')} />
ref={(postalCode) => { this.postalCode = postalCode }} />
</div>
<div className={css(commonFormStyles.input__marginRow)}>
<CommonFormTextbox
<input className={commonForm}
data-test-id='country'
spellCheck='false' onKeyDown={this.onKeyDown} onChange={this.onCountryChange}
value={this.props.currentDetail.get('country')} />
ref={(country) => { this.country = country }} />
</div>
<div className={css(commonFormStyles.input__marginRow)}>
<CommonFormTextbox
<input className={commonForm}
data-test-id='phone'
spellCheck='false' onKeyDown={this.onKeyDown} onChange={this.onPhoneChange}
value={this.props.currentDetail.get('phone')} />
ref={(phone) => { this.phone = phone }} />
</div>
<div className={css(commonFormStyles.input__marginRow)}>
<CommonFormTextbox
<input className={commonForm}
data-test-id='email'
spellCheck='false' onKeyDown={this.onKeyDown} onChange={this.onEmailChange}
value={this.props.currentDetail.get('email')} />
ref={(email) => { this.email = email }} />
</div>
</div>
</div>
Expand Down
5 changes: 4 additions & 1 deletion app/renderer/components/autofill/autofillCreditCardPanel.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,9 @@ class AutofillCreditCardPanel extends ImmutableComponent {
onNameChange (e) {
let currentDetail = this.props.currentDetail
currentDetail = currentDetail.set('name', e.target.value)
if (this.nameOnCard.value !== e.target.value) {
this.nameOnCard.value = e.target.value
}
windowActions.setAutofillCreditCardDetail(currentDetail, this.props.originalDetail)
}
onCardChange (e) {
Expand Down Expand Up @@ -80,6 +83,7 @@ class AutofillCreditCardPanel extends ImmutableComponent {
}
componentDidMount () {
this.nameOnCard.focus()
this.nameOnCard.value = this.props.currentDetail.get('name') || ''
}
render () {
var ExpMonth = []
Expand Down Expand Up @@ -119,7 +123,6 @@ class AutofillCreditCardPanel extends ImmutableComponent {
spellCheck='false'
onKeyDown={this.onKeyDown}
onChange={this.onNameChange}
value={this.props.currentDetail.get('name') || ''}
ref={(nameOnCard) => { this.nameOnCard = nameOnCard }}
/>
</div>
Expand Down
7 changes: 6 additions & 1 deletion app/renderer/components/bookmarks/addEditBookmarkHanger.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -97,12 +97,15 @@ class AddEditBookmarkHanger extends ImmutableComponent {
this.updateFolders(nextProps)
}
}
componentDidUpdate () {
}
componentDidMount () {
// Automatically save if this is triggered by the url star
if (!this.props.isModal && !this.props.shouldShowLocation) {
this.onSave(false)
}
this.setDefaultFocus()
this.bookmarkName.value = this.displayBookmarkName
}
onKeyDown (e) {
switch (e.keyCode) {
Expand Down Expand Up @@ -138,6 +141,9 @@ class AddEditBookmarkHanger extends ImmutableComponent {
// are not saved.
currentDetail = currentDetail.set('customTitle', name || 0)
}
if (this.bookmarkName.value !== name) {
this.bookmarkName.value = name
}
windowActions.setBookmarkDetail(currentDetail, this.props.originalDetail, this.props.destinationDetail, this.props.shouldShowLocation, !this.props.isModal)
}
onLocationChange (e) {
Expand Down Expand Up @@ -226,7 +232,6 @@ class AddEditBookmarkHanger extends ImmutableComponent {
spellCheck='false'
onKeyDown={this.onKeyDown}
onChange={this.onNameChange}
value={this.displayBookmarkName}
ref={(bookmarkName) => { this.bookmarkName = bookmarkName }}
/>
</div>
Expand Down
6 changes: 1 addition & 5 deletions app/renderer/components/common/textbox.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ class Textbox extends ImmutableComponent {
this.props['data-isFormControl'] && commonStyles.formControl,
styles.textbox,
(this.props.readonly || this.props.readOnly) ? styles.readOnly : styles.outlineable,
this.props['data-isCommonForm'] && styles.isCommonForm,
this.props['data-isCommonForm'] && commonStyles.isCommonForm,
this.props['data-isSettings'] && styles.isSettings,
this.props['data-isRecoveryKeyTextbox'] && styles.recoveryKeys
)
Expand Down Expand Up @@ -75,10 +75,6 @@ const styles = StyleSheet.create({
outlineWidth: '1px'
}
},
isCommonForm: {
fontSize: globalStyles.fontSize.flyoutDialog,
width: '100%'
},
isSettings: {
width: '280px'
},
Expand Down
5 changes: 5 additions & 0 deletions app/renderer/components/styles/commonStyles.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -193,6 +193,11 @@ const styles = StyleSheet.create({
/* TODO: refactor siteDetails.less */
marginTop: '0 !important',
marginLeft: globalStyles.spacing.aboutPageSectionPadding
},

isCommonForm: {
fontSize: globalStyles.fontSize.flyoutDialog,
width: '100%'
}
})

Expand Down

0 comments on commit 5e79349

Please sign in to comment.