Skip to content

Commit b6bd82a

Browse files
moneymanolisKim Neunert
andauthored
UIUX: Overhaul of UTXO list, handling of locked UTXOs and scrollbar added to tx-table web component (#1580)
* Added tests/bitcoin to gitignore * Ensure locked UTXO can't be used for transactions, fix rounding error in coin selection, fix styling/text in general settings. * overhaul of checkbox logic in utxolist including mouseover event for checkboxes, manage psbt button action added, icon info popups added,design changes in utxo- and txlist to make the display quieter * change of balance display, scrollbars for main and tx table, bugfixes (pagination, coin selection, unsigned labeling) & some styling finetuning * deleted locked utxo balance calculations, added doc strings regarding balances * jinja comment added in tx table, making scrollbar less vivid, tx table settings changed to no compact view toggle and scrollbar on by default * more granular amount properties, little test fix. * applying new amount properties to the frontend and other parts of the code & improving balance display design * refactored a_simple_wallet to be only used in test_rest once * tests for amounts and test performance optimisations. * fix spec_node_configured * fix spec_wallet_send.js * fix spec_wallet_utxo.js * keep action teaser div hidden on wallets overview. * minor bug fix in tx-table, added includeShadowDom to cypress.json, adapted spec_wallet_utxo.js to new utxo list logic and added tests of new functionality to it. * fix spec_plugins.js and switch back to includeShadowDom false The problem with true is, that you are no longer able to spot when you need to apply the workaround described in https://docs.cypress.io/api/commands/shadow#Known-Issue as you only need to apply in a shadow-DOM. Feel free to switch it back in any test you see fit. Cypress.config('includeShadowDom',true) * better organisation of wallet utxo spec file * some wait-tweaks to cypress tests to make them run smoother on cirrus, note: cypress tests green in local dev. * longer wait in spec_elm_multi_segwit_wallet.js * fixing spec_elm_multi_segwit_wallet.js * more checks whether checkboxes get selected and additional waits for cirrus in spec_wallet_utxo.js. Co-authored-by: Kim Neunert <k9ert@gmx.de>
1 parent 06f81c5 commit b6bd82a

28 files changed

+1365
-972
lines changed

cypress.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,5 +14,6 @@
1414
"baseUrl": "http://localhost:25444",
1515
"env": {
1616
"broadcast_timeout":"8000"
17-
}
17+
},
18+
"includeShadowDom": false
1819
}
Lines changed: 80 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,26 @@
1-
describe('Operating with an elements multisig wallet', () => {
2-
1+
describe('Operating with an Elements multisig wallet', () => {
32

4-
it('Creates an two elements multisig hot wallets (segwit/nested) both 2/3', () => {
3+
it('Creates two (segwit/nested) Elements multisig (2/3) hot wallets', () => {
54
cy.viewport(1200,660)
65
cy.visit('/')
76
cy.get('#node-switch-icon').click()
87
cy.get('#elements_node-select-node-form > .item > div').click()
98

10-
// Delete Wallet if existing
9+
// Delete wallets if existing
1110
cy.deleteWallet("Elm Multi Segwit Wallet")
1211
cy.deleteWallet("Elm Multi Nested Wallet")
1312

14-
// Create the Hot Element Wallets
15-
cy.addHotDevice("Hot Elements Device 2","elements")
16-
cy.addHotDevice("Hot Elements Device 3","elements")
17-
cy.addHotDevice("Hot Elements Device 4","elements")
13+
// Add devices for multisig
14+
cy.addHotDevice("Elm Multisig Device 1","elements")
15+
cy.addHotDevice("Elm Multisig Device 2","elements")
16+
cy.addHotDevice("Elm Multisig Device 3","elements")
1817

1918
// Create Segwit multisig wallet
2019
cy.get('#btn_new_wallet').click()
2120
cy.get('[href="./multisig/"]').click()
22-
cy.get('#hot_elements_device_2').click()
23-
cy.get('#hot_elements_device_3').click()
24-
cy.get('#hot_elements_device_4').click()
21+
cy.get('#elm_multisig_device_1').click()
22+
cy.get('#elm_multisig_device_2').click()
23+
cy.get('#elm_multisig_device_3').click()
2524
cy.get('#submit-device').click()
2625
cy.get('#wallet_name').type("Elm Multi Segwit Wallet")
2726
cy.get(':nth-child(9) > .inline').clear()
@@ -34,193 +33,156 @@ describe('Operating with an elements multisig wallet', () => {
3433
//Get some funds
3534
cy.mine2wallet("elm")
3635

37-
3836
// Create Nested multisig wallet
3937
cy.get('#btn_new_wallet').click()
4038
cy.get('[href="./multisig/"]').click()
41-
cy.get('#hot_elements_device_2').click()
42-
cy.get('#hot_elements_device_3').click()
43-
cy.get('#hot_elements_device_4').click()
39+
cy.get('#elm_multisig_device_1').click()
40+
cy.get('#elm_multisig_device_2').click()
41+
cy.get('#elm_multisig_device_3').click()
4442
cy.get('#submit-device').click()
45-
cy.get(':nth-child(1) > #type_nested_segwit_btn') // Nested!!
43+
// Switch to Nested Segwit
44+
cy.get('#type_nested_segwit_btn').click()
4645
cy.get('#wallet_name').type("Elm Multi Nested Wallet")
46+
// 2 of 3
4747
cy.get(':nth-child(9) > .inline').clear()
48-
// 2 of 2
4948
cy.get(':nth-child(9) > .inline').type("2")
5049
// submit
5150
cy.get('#keysform > .centered').click()
52-
// Cancel-button (no pdf download)
51+
// Click cancel (no pdf download)
5352
cy.get('#page_overlay_popup_cancel_button').click()
54-
//Get some funds
53+
// Get some funds
5554
cy.mine2wallet("elm")
5655
})
5756

58-
it('Spending to a Confidential address from segwit', () => {
57+
it('Spending to a confidential address from segwit', () => {
5958
cy.viewport(1200,660)
6059
cy.visit('/')
61-
// spend the money again
6260
cy.contains("Elm Multi Segwit Wallet").click()
63-
64-
cy.get('#fullbalance_amount').then(($div) => {
61+
62+
cy.get('#fullbalance_amount', { timeout: Cypress.env("broadcast_timeout") }).then(($div) => {
63+
// Create PSBT
6564
const oldBalance = parseFloat($div.text())
6665
expect(oldBalance).to.be.gte(1.5)
67-
cy.createPsbt("el1qqdsywea5scrn7t9q83fd540pw447h0uae30pdp82rzgkl7yzvjz6gra9ls8qu6sslw4s0ck48we06zhqd6kwjy2quh69zwxwn", "Burn address","1.5")
66+
cy.createPsbt("el1qqdsywea5scrn7t9q83fd540pw447h0uae30pdp82rzgkl7yzvjz6gra9ls8qu6sslw4s0ck48we06zhqd6kwjy2quh69zwxwn", "Burn address","1.5")
6867

68+
// First signature
69+
cy.get('#elm_multisig_device_1_tx_sign_btn').click()
70+
cy.get('#elm_multisig_device_1_hot_sign_btn').click()
71+
cy.contains('Sign transaction').click()
6972

70-
cy.get('#hot_elements_device_2_tx_sign_btn').click()
71-
cy.get('#hot_elements_device_2_hot_sign_btn').click()
72-
cy.get('#hot_enter_passphrase__submit').click()
73-
cy.get('#hot_elements_device_3_tx_sign_btn').click()
74-
cy.get('#hot_elements_device_3_hot_sign_btn').click()
75-
cy.get('#hot_enter_passphrase__submit').click()
76-
// cy.get('#broadcast_local_btn').click()
77-
// There is a bug as the first device doesn't seem to have signed and so we can't send the tx just right from here
78-
// 2 more clicks until to get to the send button
79-
cy.get('#btn_send').click()
80-
cy.get('.row > :nth-child(1) > .btn').click()
81-
cy.get('#send_tx_btn').click()
73+
// Second signature
74+
cy.get('#elm_multisig_device_2_tx_sign_btn').click()
75+
cy.get('#elm_multisig_device_2_hot_sign_btn').click()
76+
cy.contains('Sign transaction').click()
77+
78+
// Send the tx
8279
cy.get('#broadcast_local_btn').click()
83-
// gets redirected to "transactions"
84-
80+
81+
// Redirect to "transactions", check balance there
8582
cy.get('#fullbalance_amount', { timeout: Cypress.env("broadcast_timeout") })
8683
.should(($div) => {
8784
const newBalance = parseFloat($div.text())
8885
expect(newBalance).to.be.lte(oldBalance - 1.5)
8986
})
9087
})
91-
92-
// Workaround: Transaction does not disappear
93-
cy.get('#btn_send').click()
94-
// The "delete" button in the first psbt
95-
cy.get('.row > :nth-child(2) > .btn').click()
96-
97-
9888
})
9989

100-
it('Spending to a Unconfidential address from segwit', () => {
101-
90+
it('Spending to an unnconfidential address from segwit', () => {
10291
cy.viewport(1200,660)
10392
cy.visit('/')
104-
// spend the money again
10593
cy.contains("Elm Multi Segwit Wallet").click()
10694

107-
cy.get('#fullbalance_amount').then(($div) => {
95+
cy.get('#fullbalance_amount', { timeout: Cypress.env("broadcast_timeout") }).then(($div) => {
96+
// Create PSBT
10897
const oldBalance = parseFloat($div.text())
10998
expect(oldBalance).to.be.gte(1.5)
11099
cy.createPsbt("ert1q38la37ulxgc0uwt334he46eua7h8qagqnlm5phcqk7ntgv3x73cqjtr2fa", "unconf Burn address","1.5")
100+
101+
// First signature
102+
cy.get('#elm_multisig_device_1_tx_sign_btn').click()
103+
cy.get('#elm_multisig_device_1_hot_sign_btn').click()
104+
cy.contains('Sign transaction').click()
111105

112-
113-
cy.get('#hot_elements_device_2_tx_sign_btn').click()
114-
cy.get('#hot_elements_device_2_hot_sign_btn').click()
115-
cy.get('#hot_enter_passphrase__submit').click()
116-
cy.get('#hot_elements_device_3_tx_sign_btn').click()
117-
cy.get('#hot_elements_device_3_hot_sign_btn').click()
118-
cy.get('#hot_enter_passphrase__submit').click()
119-
// cy.get('#broadcast_local_btn').click()
120-
// There is a bug as the first device doesn't seem to have signed and so we can't send the tx just right from here
121-
// 2 more clicks until to get to the send button
122-
cy.get('#btn_send').click()
123-
cy.get('.row > :nth-child(1) > .btn').click()
124-
cy.get('#send_tx_btn').click()
125-
cy.get('#broadcast_local_btn').click()
126-
// gets redirected to "transactions"
106+
// Second signature
107+
cy.get('#elm_multisig_device_2_tx_sign_btn').click()
108+
cy.get('#elm_multisig_device_2_hot_sign_btn').click()
109+
cy.contains('Sign transaction').click()
127110

111+
// Send tx
112+
cy.get('#broadcast_local_btn').click()
113+
114+
// Redirect to "transactions", check balance there
128115
cy.get('#fullbalance_amount', { timeout: Cypress.env("broadcast_timeout") })
129116
.should(($div) => {
130117
const newBalance = parseFloat($div.text())
131118
expect(newBalance).to.be.lte(oldBalance - 1.5)
132119
})
133120
})
134-
135-
// Workaround: Transaction does not disappear
136-
// Strange bug, not needed here
137-
// cy.get('#btn_send').click()
138-
// The "delete" button in the first psbt
139-
// cy.get('.row > :nth-child(2) > .btn').click()
140-
141121
})
142122

143-
it('Spending to a Confidential address from nested', () => {
123+
it('Spending to a confidential address from nested', () => {
144124
cy.viewport(1200,660)
145125
cy.visit('/')
146-
// spend the money again
147126
cy.contains("Elm Multi Nested Wallet").click()
148127

149-
cy.get('#fullbalance_amount').then(($div) => {
128+
cy.get('#fullbalance_amount', { timeout: Cypress.env("broadcast_timeout") }).then(($div) => {
129+
// Create PSBT
150130
const oldBalance = parseFloat($div.text())
151131
expect(oldBalance).to.be.gte(1.5)
152132
cy.createPsbt("el1qqdsywea5scrn7t9q83fd540pw447h0uae30pdp82rzgkl7yzvjz6gra9ls8qu6sslw4s0ck48we06zhqd6kwjy2quh69zwxwn", "Burn address","1.5")
153133

134+
// First signature
135+
cy.get('#elm_multisig_device_1_tx_sign_btn').click()
136+
cy.get('#elm_multisig_device_1_hot_sign_btn').click()
137+
cy.contains('Sign transaction').click()
154138

155-
cy.get('#hot_elements_device_2_tx_sign_btn').click()
156-
cy.get('#hot_elements_device_2_hot_sign_btn').click()
157-
cy.get('#hot_enter_passphrase__submit').click()
158-
cy.get('#hot_elements_device_3_tx_sign_btn').click()
159-
cy.get('#hot_elements_device_3_hot_sign_btn').click()
160-
cy.get('#hot_enter_passphrase__submit').click()
161-
// cy.get('#broadcast_local_btn').click()
162-
// There is a bug as the first device doesn't seem to have signed and so we can't send the tx just right from here
163-
// 2 more clicks until to get to the send button
164-
cy.get('#btn_send').click()
165-
cy.get('.row > :nth-child(1) > .btn').click()
166-
cy.get('#send_tx_btn').click()
139+
// Second signature
140+
cy.get('#elm_multisig_device_2_tx_sign_btn').click()
141+
cy.get('#elm_multisig_device_2_hot_sign_btn').click()
142+
cy.contains('Sign transaction').click()
143+
144+
// Send the tx
167145
cy.get('#broadcast_local_btn').click()
168-
// gets redirected to "transactions"
169146

147+
// Redirect to "transactions", check balance there
170148
cy.get('#fullbalance_amount', { timeout: Cypress.env("broadcast_timeout") })
171149
.should(($div) => {
172150
const newBalance = parseFloat($div.text())
173151
expect(newBalance).to.be.lte(oldBalance - 1.5)
174152
})
175153
})
176-
177-
// Workaround: Transaction does not disappear
178-
cy.get('#btn_send').click()
179-
// The "delete" button in the first psbt
180-
cy.get('.row > :nth-child(2) > .btn').click()
181-
182-
183154
})
184155

185-
it('Spending to a Unconfidential address from nested', () => {
186-
156+
it('Spending to a unconfidential address from nested', () => {
187157
cy.viewport(1200,660)
188158
cy.visit('/')
189-
// spend the money again
190159
cy.contains("Elm Multi Nested Wallet").click()
191160

192-
cy.get('#fullbalance_amount').then(($div) => {
161+
cy.get('#fullbalance_amount', { timeout: Cypress.env("broadcast_timeout") }).then(($div) => {
162+
// Create PSBT
193163
const oldBalance = parseFloat($div.text())
194164
expect(oldBalance).to.be.gte(1.5)
195165
cy.createPsbt("ert1q38la37ulxgc0uwt334he46eua7h8qagqnlm5phcqk7ntgv3x73cqjtr2fa", "unconf Burn address","1.5")
196166

167+
// First signature
168+
cy.get('#elm_multisig_device_1_tx_sign_btn').click()
169+
cy.get('#elm_multisig_device_1_hot_sign_btn').click()
170+
cy.contains('Sign transaction').click()
171+
172+
// Second signature
173+
cy.get('#elm_multisig_device_2_tx_sign_btn').click()
174+
cy.get('#elm_multisig_device_2_hot_sign_btn').click()
175+
cy.contains('Sign transaction').click()
197176

198-
cy.get('#hot_elements_device_2_tx_sign_btn').click()
199-
cy.get('#hot_elements_device_2_hot_sign_btn').click()
200-
cy.get('#hot_enter_passphrase__submit').click()
201-
cy.get('#hot_elements_device_3_tx_sign_btn').click()
202-
cy.get('#hot_elements_device_3_hot_sign_btn').click()
203-
cy.get('#hot_enter_passphrase__submit').click()
204-
// cy.get('#broadcast_local_btn').click()
205-
// There is a bug as the first device doesn't seem to have signed and so we can't send the tx just right from here
206-
// 2 more clicks until to get to the send button
207-
cy.get('#btn_send').click()
208-
cy.get('.row > :nth-child(1) > .btn').click()
209-
cy.get('#send_tx_btn').click()
177+
// Send the tx
210178
cy.get('#broadcast_local_btn').click()
211-
// gets redirected to "transactions"
179+
180+
// Redirect to "transactions", check balance there
212181
cy.get('#fullbalance_amount', { timeout: Cypress.env("broadcast_timeout") })
213182
.should(($div) => {
214183
const newBalance = parseFloat($div.text())
215184
expect(newBalance).to.be.lte(oldBalance - 1.5)
216185
})
217186
})
218-
219-
// Workaround: Transaction does not disappear
220-
// Strange bug, not needed here
221-
// cy.get('#btn_send').click()
222-
// The "delete" button in the first psbt
223-
// cy.get('.row > :nth-child(2) > .btn').click()
224-
225187
})
226188
})

cypress/integration/spec_node_configured.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ describe('Node Configured', () => {
55
cy.addDevice("Testdevice Ghost")
66
cy.get('body').then(($body) => {
77
if ($body.text().includes('Testwallet Ghost')) {
8-
cy.get('#wallets_list > .item > svg').click()
9-
cy.get(':nth-child(6) > .right').click()
8+
cy.contains('Testwallet Ghost').click()
9+
cy.get('#btn_settings').click({"force": true})
1010
cy.get('#advanced_settings_tab_btn').click()
11-
cy.get('.card > :nth-child(9) > .btn').click()
11+
cy.get('#delete_wallet').click()
1212
}
1313
})
1414
cy.get('#btn_new_wallet').click()

cypress/integration/spec_plugins.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ describe('plugins are working', () => {
77
// choose address
88
cy.get('#test_hot_wallet_1-sidebar-list-item').click()
99
cy.get('[href="/wallets/wallet/test_hot_wallet_1/addresses/"]').click()
10-
cy.get('addresses-table').shadow().find('address-row').eq(0).shadow().find('.explorer-link').click()
10+
cy.get('addresses-table').shadow().find('address-row').eq(0).shadow().find('.explorer-link').eq(0).click({position: 'top'})
1111
cy.get('address-data').shadow().find('#associate-btn').click()
1212

1313
cy.contains("Service integration requires an authentication method that includes a password")
@@ -20,7 +20,7 @@ describe('plugins are working', () => {
2020
// choose address again
2121
cy.get('#test_hot_wallet_1-sidebar-list-item').click()
2222
cy.get('[href="/wallets/wallet/test_hot_wallet_1/addresses/"]').click()
23-
cy.get('addresses-table').shadow().find('address-row').eq(0).shadow().find('.explorer-link').click()
23+
cy.get('addresses-table').shadow().find('address-row').eq(0).shadow().find('.explorer-link').eq(0).click()
2424
cy.get('address-data').shadow().find('#associate-btn').click()
2525
cy.contains("Associating an address with a service will")
2626

0 commit comments

Comments
 (0)