From 6b6d612041f98b018b5595569ee73e2f4f7449f1 Mon Sep 17 00:00:00 2001 From: Zoe Date: Tue, 11 Feb 2020 11:59:49 +0000 Subject: [PATCH 1/3] Fix error message rendering for key entry Relates to https://github.com/vector-im/riot-web/issues/12288 --- .../AccessSecretStorageDialog.js | 8 +- .../dialogs/AccessSecretStorageDialog-test.js | 106 ++++++++++++++++++ 2 files changed, 110 insertions(+), 4 deletions(-) create mode 100644 test/components/views/dialogs/AccessSecretStorageDialog-test.js diff --git a/src/components/views/dialogs/secretstorage/AccessSecretStorageDialog.js b/src/components/views/dialogs/secretstorage/AccessSecretStorageDialog.js index 68ae8281c4..e3a7d7f532 100644 --- a/src/components/views/dialogs/secretstorage/AccessSecretStorageDialog.js +++ b/src/components/views/dialogs/secretstorage/AccessSecretStorageDialog.js @@ -190,10 +190,6 @@ export default class AccessSecretStorageDialog extends React.PureComponent { let keyStatus; if (this.state.recoveryKey.length === 0) { keyStatus =
; - } else if (this.state.recoveryKeyValid) { - keyStatus =
- {"\uD83D\uDC4D "}{_t("This looks like a valid recovery key!")} -
; } else if (this.state.keyMatches === false) { keyStatus =
{"\uD83D\uDC4E "}{_t( @@ -201,6 +197,10 @@ export default class AccessSecretStorageDialog extends React.PureComponent { "entered the correct recovery key.", )}
; + } else if (this.state.recoveryKeyValid) { + keyStatus =
+ {"\uD83D\uDC4D "}{_t("This looks like a valid recovery key!")} +
; } else { keyStatus =
{"\uD83D\uDC4E "}{_t("Not a valid recovery key")} diff --git a/test/components/views/dialogs/AccessSecretStorageDialog-test.js b/test/components/views/dialogs/AccessSecretStorageDialog-test.js new file mode 100644 index 0000000000..4e2ade6069 --- /dev/null +++ b/test/components/views/dialogs/AccessSecretStorageDialog-test.js @@ -0,0 +1,106 @@ +/* +Copyright 2020 The Matrix.org Foundation C.I.C. + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import React from 'react'; +import TestRenderer from 'react-test-renderer'; +import sdk from '../../../skinned-sdk'; +import {MatrixClientPeg} from '../../../../src/MatrixClientPeg'; +import { stubClient } from '../../../test-utils'; + +const AccessSecretStorageDialog = sdk.getComponent("dialogs.secretstorage.AccessSecretStorageDialog"); + +describe("AccessSecretStorageDialog", function () { + it("Closes the dialog if _onRecoveryKeyNext is called with a valid key", (done) => { + const testInstance = TestRenderer.create( + p && p.recoveryKey && p.recoveryKey == "a"} + onFinished={(v) => { + if (v) { done() } + }} + /> + ); + testInstance.getInstance().setState({ + recoveryKeyValid: true, + recoveryKey: "a", + }); + const e = { preventDefault: () => {} } + testInstance.getInstance()._onRecoveryKeyNext(e); + }); + + it("Considers a valid key to be valid", function () { + const testInstance = TestRenderer.create( + true} + /> + ); + const v = "asfd"; + const e = { target: { value: v } }; + stubClient(); + MatrixClientPeg.get().isValidRecoveryKey = function (k) { + return k == v; + } + testInstance.getInstance()._onRecoveryKeyChange(e); + const { recoveryKeyValid } = testInstance.getInstance().state; + expect(recoveryKeyValid).toBe(true); + }); + + it("Notifies the user if they input an invalid recovery key", async function (done) { + const testInstance = TestRenderer.create( + false} + /> + ); + const e = { target: { value: "a" } }; + stubClient(); + MatrixClientPeg.get().isValidRecoveryKey = () => true; + testInstance.getInstance()._onRecoveryKeyChange(e); + await testInstance.getInstance()._onRecoveryKeyNext({ preventDefault: () => {} }); + const { keyMatches } = testInstance.getInstance().state; + expect(keyMatches).toBe(false); + const notification = testInstance.root.findByProps({ + className: "mx_AccessSecretStorageDialog_keyStatus", + }); + expect(notification.props.children).toEqual( + ["\uD83D\uDC4E ", "Unable to access secret storage. Please verify that you " + + "entered the correct recovery key."]); + done() + }); + + it("Notifies the user if they input an invalid passphrase", async function (done) { + const testInstance = TestRenderer.create( + false} + onFinished={() => {}} + keyInfo={ { passphrase: { + salt: 'nonempty', + iterations: 2, + } } } + /> + ); + const e = { target: { value: "a" } }; + stubClient(); + MatrixClientPeg.get().isValidRecoveryKey = () => false; + testInstance.getInstance()._onPassPhraseChange(e); + await testInstance.getInstance()._onPassPhraseNext({ preventDefault: () => {} }) + const notification = testInstance.root.findByProps({ + className: "mx_AccessSecretStorageDialog_keyStatus", + }); + expect(notification.props.children).toEqual( + ["\uD83D\uDC4E ", "Unable to access secret storage. Please verify that you " + + "entered the correct passphrase."]); + done(); + }); +}); From a67778088977553055866fdcb20b8d5efa6ccd6f Mon Sep 17 00:00:00 2001 From: Zoe Date: Tue, 11 Feb 2020 12:05:58 +0000 Subject: [PATCH 2/3] i18n --- src/i18n/strings/en_EN.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/i18n/strings/en_EN.json b/src/i18n/strings/en_EN.json index 940777c1c7..f6090ce09f 100644 --- a/src/i18n/strings/en_EN.json +++ b/src/i18n/strings/en_EN.json @@ -1654,8 +1654,8 @@ "Access your secure message history and your cross-signing identity for verifying other sessions by entering your passphrase.": "Access your secure message history and your cross-signing identity for verifying other sessions by entering your passphrase.", "If you've forgotten your passphrase you can use your recovery key or set up new recovery options.": "If you've forgotten your passphrase you can use your recovery key or set up new recovery options.", "Enter secret storage recovery key": "Enter secret storage recovery key", - "This looks like a valid recovery key!": "This looks like a valid recovery key!", "Unable to access secret storage. Please verify that you entered the correct recovery key.": "Unable to access secret storage. Please verify that you entered the correct recovery key.", + "This looks like a valid recovery key!": "This looks like a valid recovery key!", "Not a valid recovery key": "Not a valid recovery key", "Access your secure message history and your cross-signing identity for verifying other sessions by entering your recovery key.": "Access your secure message history and your cross-signing identity for verifying other sessions by entering your recovery key.", "If you've forgotten your recovery key you can .": "If you've forgotten your recovery key you can .", From 9a5663056d41ca0b3a695ad4a6bc9ee32b53ddf9 Mon Sep 17 00:00:00 2001 From: Zoe Date: Tue, 11 Feb 2020 12:06:40 +0000 Subject: [PATCH 3/3] lint --- .../dialogs/AccessSecretStorageDialog-test.js | 28 +++++++++---------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/test/components/views/dialogs/AccessSecretStorageDialog-test.js b/test/components/views/dialogs/AccessSecretStorageDialog-test.js index 4e2ade6069..30512ca4dd 100644 --- a/test/components/views/dialogs/AccessSecretStorageDialog-test.js +++ b/test/components/views/dialogs/AccessSecretStorageDialog-test.js @@ -22,46 +22,46 @@ import { stubClient } from '../../../test-utils'; const AccessSecretStorageDialog = sdk.getComponent("dialogs.secretstorage.AccessSecretStorageDialog"); -describe("AccessSecretStorageDialog", function () { +describe("AccessSecretStorageDialog", function() { it("Closes the dialog if _onRecoveryKeyNext is called with a valid key", (done) => { const testInstance = TestRenderer.create( p && p.recoveryKey && p.recoveryKey == "a"} onFinished={(v) => { - if (v) { done() } + if (v) { done(); } }} - /> + />, ); testInstance.getInstance().setState({ recoveryKeyValid: true, recoveryKey: "a", }); - const e = { preventDefault: () => {} } + const e = { preventDefault: () => {} }; testInstance.getInstance()._onRecoveryKeyNext(e); }); - it("Considers a valid key to be valid", function () { + it("Considers a valid key to be valid", function() { const testInstance = TestRenderer.create( true} - /> + />, ); const v = "asfd"; const e = { target: { value: v } }; stubClient(); - MatrixClientPeg.get().isValidRecoveryKey = function (k) { + MatrixClientPeg.get().isValidRecoveryKey = function(k) { return k == v; - } + }; testInstance.getInstance()._onRecoveryKeyChange(e); const { recoveryKeyValid } = testInstance.getInstance().state; expect(recoveryKeyValid).toBe(true); }); - it("Notifies the user if they input an invalid recovery key", async function (done) { + it("Notifies the user if they input an invalid recovery key", async function(done) { const testInstance = TestRenderer.create( false} - /> + />, ); const e = { target: { value: "a" } }; stubClient(); @@ -76,10 +76,10 @@ describe("AccessSecretStorageDialog", function () { expect(notification.props.children).toEqual( ["\uD83D\uDC4E ", "Unable to access secret storage. Please verify that you " + "entered the correct recovery key."]); - done() + done(); }); - it("Notifies the user if they input an invalid passphrase", async function (done) { + it("Notifies the user if they input an invalid passphrase", async function(done) { const testInstance = TestRenderer.create( false} @@ -88,13 +88,13 @@ describe("AccessSecretStorageDialog", function () { salt: 'nonempty', iterations: 2, } } } - /> + />, ); const e = { target: { value: "a" } }; stubClient(); MatrixClientPeg.get().isValidRecoveryKey = () => false; testInstance.getInstance()._onPassPhraseChange(e); - await testInstance.getInstance()._onPassPhraseNext({ preventDefault: () => {} }) + await testInstance.getInstance()._onPassPhraseNext({ preventDefault: () => {} }); const notification = testInstance.root.findByProps({ className: "mx_AccessSecretStorageDialog_keyStatus", });