1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-11-21 17:37:01 +01:00

Updating network list item hover (#20063)

* Updating network list item hover

* Updating e2e test

* Updating e2e test

* Updating e2e test

* Updating more e2e tests

* Updating more e2e tests
This commit is contained in:
George Marshall 2023-07-19 10:12:24 -07:00 committed by GitHub
parent 61e88f4bdf
commit b4bc033b72
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 15 additions and 17 deletions

View File

@ -363,7 +363,7 @@ describe('Custom network', function () {
const arbitrumNetwork = await driver.findElements({
text: 'Arbitrum One',
tag: 'span',
tag: 'button',
});
assert.ok(arbitrumNetwork.length, 1);
},

View File

@ -63,7 +63,7 @@ describe('Chain Interactions', function () {
await driver.clickElement('[data-testid="network-display"]');
const ganacheChain = await driver.findElements({
text: `Localhost ${port}`,
tag: 'span',
tag: 'button',
});
assert.ok(ganacheChain.length, 1);
},

View File

@ -185,7 +185,7 @@ describe('Stores custom RPC history', function () {
await driver.waitForElementNotPresent('.loading-overlay');
await driver.clickElement('[data-testid="network-display"]');
await driver.clickElement({ text: 'Ethereum Mainnet', tag: 'span' });
await driver.clickElement({ text: 'Ethereum Mainnet', tag: 'button' });
},
);
});
@ -237,7 +237,7 @@ describe('Stores custom RPC history', function () {
});
// click Mainnet to dismiss network dropdown
await driver.clickElement({ text: 'Ethereum Mainnet', tag: 'span' });
await driver.clickElement({ text: 'Ethereum Mainnet', tag: 'button' });
assert.equal(customRpcs.length, 2);
},

View File

@ -79,7 +79,7 @@ describe('Import flow', function () {
await driver.delay(largeDelayMs);
await driver.clickElement('[data-testid="network-display"]');
await driver.clickElement('.toggle-button');
await driver.clickElement({ text: 'Localhost', tag: 'span' });
await driver.clickElement({ text: 'Localhost', tag: 'button' });
// choose Create account from the account menu
await driver.clickElement('[data-testid="account-menu-icon"]');

View File

@ -47,7 +47,7 @@ describe('MetaMask', function () {
await driver.switchToWindow(windowHandles[0]);
await driver.clickElement('[data-testid="network-display"]');
await driver.clickElement({ text: 'Ethereum Mainnet', tag: 'span' });
await driver.clickElement({ text: 'Ethereum Mainnet', tag: 'button' });
await driver.switchToWindowWithTitle('E2E Test Dapp', windowHandles);
const switchedNetworkDiv = await driver.waitForSelector({

View File

@ -18,13 +18,9 @@ exports[`NetworkListItem renders properly 1`] = `
class="mm-box multichain-network-list-item__network-name"
>
<button
class="mm-box mm-text mm-button-base mm-button-base--ellipsis mm-button-link mm-button-link--size-auto mm-text--body-md-medium mm-text--ellipsis mm-box--padding-right-0 mm-box--padding-left-0 mm-box--display-inline-flex mm-box--justify-content-center mm-box--align-items-center mm-box--color-text-default mm-box--background-color-transparent"
class="mm-box mm-text mm-text--body-md mm-text--ellipsis mm-box--color-text-default mm-box--background-color-transparent"
>
<span
class="mm-box mm-text mm-text--inherit mm-text--ellipsis mm-box--color-text-default"
>
Polygon
</span>
Polygon
</button>
</div>
<button

View File

@ -16,7 +16,7 @@ import {
import {
AvatarNetwork,
ButtonIcon,
ButtonLink,
Text,
IconName,
Box,
} from '../../component-library';
@ -55,7 +55,7 @@ export const NetworkListItem = ({
useEffect(() => {
if (networkRef.current && selected) {
networkRef.current.querySelector('.mm-button-link').focus();
networkRef.current.focus();
}
}, [networkRef, selected]);
@ -72,7 +72,6 @@ export const NetworkListItem = ({
alignItems={AlignItems.center}
justifyContent={JustifyContent.spaceBetween}
width={BlockSize.Full}
ref={networkRef}
>
{selected && (
<Box
@ -87,12 +86,15 @@ export const NetworkListItem = ({
src={iconSrc}
/>
<Box className="multichain-network-list-item__network-name">
<ButtonLink
<Text
ref={networkRef}
as="button"
onClick={(e) => {
e.stopPropagation();
onClick();
}}
color={TextColor.textDefault}
backgroundColor={BackgroundColor.transparent}
ellipsis
>
{name.length > MAXIMUM_CHARACTERS_WITHOUT_TOOLTIP ? (
@ -106,7 +108,7 @@ export const NetworkListItem = ({
) : (
name
)}
</ButtonLink>
</Text>
</Box>
{onDeleteClick ? (
<ButtonIcon