mirror of
https://github.com/kremalicious/metamask-extension.git
synced 2024-12-23 09:52:26 +01:00
Make account details modal close button easier to click (#7797)
The account details close button is difficult to click from the e2e tests because it has a size of zero. The actual icon is added via CSS as an `::after` pseudo-element. The CSS has been adjusted to give the icon a size, and it the markup is now a `button` rather than a `div`.
This commit is contained in:
parent
61ab053bb1
commit
dac83f6188
@ -112,7 +112,8 @@ describe('MetaMask', function () {
|
||||
publicAddress = await addressInput.getAttribute('value')
|
||||
const accountModal = await driver.findElement(By.css('span .modal'))
|
||||
|
||||
await driver.executeScript("document.querySelector('.account-modal-close').click()")
|
||||
const accountModalClose = await driver.findElement(By.css('.account-modal-close'))
|
||||
await accountModalClose.click()
|
||||
|
||||
await driver.wait(until.stalenessOf(accountModal))
|
||||
await delay(regularDelayMs)
|
||||
|
@ -118,7 +118,8 @@ describe('Using MetaMask with an existing account', function () {
|
||||
const [address] = await findElements(driver, By.css('input.qr-ellip-address'))
|
||||
assert.equal(await address.getAttribute('value'), testAddress)
|
||||
|
||||
await driver.executeScript("document.querySelector('.account-modal-close').click()")
|
||||
const accountModalClose = await driver.findElement(By.css('.account-modal-close'))
|
||||
await accountModalClose.click()
|
||||
await delay(largeDelayMs)
|
||||
})
|
||||
|
||||
@ -128,7 +129,8 @@ describe('Using MetaMask with an existing account', function () {
|
||||
const detailModal = await driver.findElement(By.css('span .modal'))
|
||||
await delay(regularDelayMs)
|
||||
|
||||
await driver.executeScript("document.querySelector('.account-modal-close').click()")
|
||||
const accountModalClose = await driver.findElement(By.css('.account-modal-close'))
|
||||
await accountModalClose.click()
|
||||
await driver.wait(until.stalenessOf(detailModal))
|
||||
await delay(regularDelayMs)
|
||||
})
|
||||
|
@ -117,7 +117,8 @@ describe('MetaMask', function () {
|
||||
|
||||
const accountModal = await driver.findElement(By.css('span .modal'))
|
||||
|
||||
await driver.executeScript("document.querySelector('.account-modal-close').click()")
|
||||
const accountModalClose = await driver.findElement(By.css('.account-modal-close'))
|
||||
await accountModalClose.click()
|
||||
|
||||
await driver.wait(until.stalenessOf(accountModal))
|
||||
await delay(regularDelayMs)
|
||||
|
@ -148,7 +148,8 @@ describe('MetaMask', function () {
|
||||
|
||||
const accountModal = await driver.findElement(By.css('span .modal'))
|
||||
|
||||
await driver.executeScript("document.querySelector('.account-modal-close').click()")
|
||||
const accountModalClose = await driver.findElement(By.css('.account-modal-close'))
|
||||
await accountModalClose.click()
|
||||
|
||||
await driver.wait(until.stalenessOf(accountModal))
|
||||
await delay(regularDelayMs)
|
||||
|
@ -113,7 +113,8 @@ describe('MetaMask', function () {
|
||||
publicAddress = await addressInput.getAttribute('value')
|
||||
const accountModal = await driver.findElement(By.css('span .modal'))
|
||||
|
||||
await driver.executeScript("document.querySelector('.account-modal-close').click()")
|
||||
const accountModalClose = await driver.findElement(By.css('.account-modal-close'))
|
||||
await accountModalClose.click()
|
||||
|
||||
await driver.wait(until.stalenessOf(accountModal))
|
||||
await delay(regularDelayMs)
|
||||
|
@ -145,7 +145,8 @@ describe('MetaMask', function () {
|
||||
const newPublicAddress = await addressInput.getAttribute('value')
|
||||
const accountModal = await driver.findElement(By.css('span .modal'))
|
||||
|
||||
await driver.executeScript("document.querySelector('.account-modal-close').click()")
|
||||
const accountModalClose = await driver.findElement(By.css('.account-modal-close'))
|
||||
await accountModalClose.click()
|
||||
|
||||
await driver.wait(until.stalenessOf(accountModal))
|
||||
await delay(regularDelayMs)
|
||||
|
@ -26,7 +26,7 @@ export default function AccountModalContainer (props, context) {
|
||||
<span className="account-modal-back__text">{' ' + context.t('back')}</span>
|
||||
</div>
|
||||
)}
|
||||
<div className="account-modal-close" onClick={hideModal} />
|
||||
<button className="account-modal-close" onClick={hideModal} />
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
|
@ -61,14 +61,17 @@
|
||||
}
|
||||
}
|
||||
|
||||
.account-modal-close::after {
|
||||
content: '\00D7';
|
||||
.account-modal-close {
|
||||
font-size: 40px;
|
||||
background-color: transparent;
|
||||
color: $dusty-gray;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.account-modal-close::after {
|
||||
content: '\00D7';
|
||||
}
|
||||
|
||||
.account-modal-container .identicon {
|
||||
|
Loading…
Reference in New Issue
Block a user