e2e test import json file as import account strategy (#14449)

test/e2e/fixtures/import-utc-json/test-json-import-account-file.json

@@ -0,0 +1,21 @@
+{
+  "address": "0961ca10d49b9b8e371aa0bcf77fe5730b18f2e4",
+  "crypto": {
+    "ciphertext": "eb10547515f1bf3bb6eefed3cb39303c64a30560f378b789592b1ac632bbc14c",
+    "cipherparams": {
+      "iv": "25ebfc7358ce77462ef7b970e91309d6"
+    },
+    "cipher": "aes-128-ctr",
+    "kdf": "scrypt",
+    "kdfparams": {
+      "dklen": 32,
+      "salt": "42417a49fb6cbb10167d7bc4ed8ae71d02cb4ee6309a42417e0051e7472d45c5",
+      "n": 8192,
+      "r": 8,
+      "p": 1
+    },
+    "mac": "0491462fbca0c7a71d249de141736304d699749c2faf5ab575d6a502e26099d7"
+  },
+  "id": "03754e23-770b-43d3-a35e-bae1196e6f86",
+  "version": 3
+}

test/e2e/tests/from-import-ui.spec.js

@@ -1,4 +1,5 @@
 const { strict: assert } = require('assert');
+const path = require('path');
 const {
   convertToHexValue,
   withFixtures,
@@ -232,6 +233,78 @@ describe('Metamask Import UI', function () {
     );
   });
 
+  it('Import Account using json file', async function () {
+    const ganacheOptions = {
+      accounts: [
+        {
+          secretKey:
+            '0x53CB0AB5226EEBF4D872113D98332C1555DC304443BEE1CF759D15798D3C55A9',
+          balance: convertToHexValue(25000000000000000000),
+        },
+      ],
+    };
+
+    await withFixtures(
+      {
+        fixtures: 'import-ui',
+        ganacheOptions,
+        title: this.test.title,
+      },
+      async ({ driver }) => {
+        await driver.navigate();
+        await driver.fill('#password', 'correct horse battery staple');
+        await driver.press('#password', driver.Key.ENTER);
+
+        // Imports an account with JSON file
+        await driver.clickElement('.account-menu__icon');
+        await driver.clickElement({ text: 'Import Account', tag: 'div' });
+
+        await driver.clickElement('.new-account-import-form__select');
+        await driver.clickElement({ text: 'JSON File', tag: 'option' });
+
+        const fileInput = await driver.findElement('input[type="file"]');
+        const importJsonFile = path.join(
+          __dirname,
+          '..',
+          'fixtures',
+          'import-utc-json',
+          'test-json-import-account-file.json',
+        );
+
+        fileInput.sendKeys(importJsonFile);
+
+        await driver.fill('#json-password-box', 'foobarbazqux');
+
+        await driver.clickElement({ text: 'Import', tag: 'button' });
+
+        // should show the correct account name
+        const importedAccountName = await driver.findElement(
+          '.selected-account__name',
+        );
+        assert.equal(await importedAccountName.getText(), 'Account 4');
+
+        // should show the imported label
+        await driver.clickElement('.account-menu__icon');
+        // confirm 4th account is account 4, as expected
+        const accountMenuItemSelector = '.account-menu__account:nth-child(4)';
+        const fourthAccountName = await driver.findElement(
+          `${accountMenuItemSelector} .account-menu__name`,
+        );
+        assert.equal(await fourthAccountName.getText(), 'Account 4');
+        // confirm label is present on the same menu item
+        const importedLabel = await driver.findElement(
+          `${accountMenuItemSelector} .keyring-label`,
+        );
+        assert.equal(await importedLabel.getText(), 'IMPORTED');
+
+        const accountListItems = await driver.findElements(
+          '.account-menu__account',
+        );
+        assert.equal(accountListItems.length, 4);
+      },
+    );
+  });
+
   it('Import Account using private key of an already active account should result in an error', async function () {
     const testPrivateKey =
       '0x53CB0AB5226EEBF4D872113D98332C1555DC304443BEE1CF759D15798D3C55A9';