We cannot be sure of text length since some users translate Cashtab. So, support word-wrap for settings options. Improve styling so switch is always a constant size.
Details
Details
- Reviewers
PiRK - Group Reviewers
Restricted Project - Commits
- rABC09590822b77e: [Cashtab] Better css for configure options
npm test, review screenshot
before:
after:
Diff Detail
Diff Detail
- Repository
- rABC Bitcoin ABC
- Branch
- cashtab-settings-overflow
- Lint
Lint Passed - Unit
No Test Coverage - Build Status
Buildable 27842 Build 55236: Build Diff cashtab-tests Build 55235: arc lint + arc unit
Event Timeline
Comment Actions
Build Bitcoin ABC Diffs / Diff Testing (cashtab-tests) failed.
Failed tests logs:
====== CashTab Unit Tests: <App /> We do see the camera auto-open setting in the config screen on a mobile device ======
Error: Unable to find an element with the text: Auto-open camera. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, script, style
<body>
<div
class="ant-notification ant-notification-topRight css-dev-only-do-not-override-1rqnfsa ant-notification-stack ant-notification-stack-expanded"
style="right: 0px; top: 24px;"
>
<div
class="ant-notification-notice-wrapper"
style="transform: translate3d(0, 0, 0);"
>
<div
class="ant-notification-notice ant-notification-notice-success ant-notification-notice-closable"
>
<div
class="ant-notification-notice-content"
>
<div
class="ant-notification-notice-with-icon"
role="alert"
>
<span
aria-label="check-circle"
class="anticon anticon-check-circle ant-notification-notice-icon ant-notification-notice-icon-success"
role="img"
>
<svg
aria-hidden="true"
data-icon="check-circle"
fill="currentColor"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 01-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z"
/>
</svg>
</span>
<div
class="ant-notification-notice-message"
>
Success
</div>
<div
class="ant-notification-notice-description"
>
ecash:qphlhe78677sz227k83hrh542qeehh8el5lcjwk72y added to Contact List
</div>
</div>
</div>
<a
class="ant-notification-notice-close"
tabindex="0"
>
<span
class="ant-notification-notice-close-x"
>
<span
aria-label="close"
class="anticon anticon-close ant-notification-notice-close-icon"
role="img"
>
<svg
aria-hidden="true"
data-icon="close"
fill="currentColor"
fill-rule="evenodd"
focusable="false"
height="1em"
viewBox="64 64 896 896"
width="1em"
>
<path
d="M799.86 166.31c.02 0 .04.02.08.06l57.69 57.7c.04.03.05.05.06.08a.12.12 0 010 .06c0 .03-.02.05-.06.09L569.93 512l287.7 287.7c.04.04.05.06.06.09a.12.12 0 010 .07c0 .02-.02.04-.06.08l-57.7 57.69c-.03.04-.05.05-.07.06a.12.12 0 01-.07 0c-.03 0-.05-.02-.09-.06L512 569.93l-287.7 287.7c-.04.04-.06.05-.09.06a.12.12 0 01-.07 0c-.02 0-.04-.02-.08-.06l-57.69-57.7c-.04-.03-.05-.05-.06-.07a.12.12 0 010-.07c0-.03.02-.05.06-.09L454.07 512l-287.7-287.7c-.04-.04-.05-.06-.06-.09a.12.12 0 010-.07c0-.02.02-.04.06-.08l57.7-57.69c.03-.04.05-.05.07-.06a.12.12 0 01.07 0c.03 0 .05.02.09.06L512 454.07l287.7-287.7c.04-.04.06-.05.09-.06a.12.12 0 01.07 0z"
/>
</svg>
</span>
</span>
</a>
</div>
</div>
</div>
<div>
<div
class="ant-spin-nested-loading css-dev-only-do-not-override-1rqnfsa"
>
<div
class="ant-spin-container"
>
<div
class="sc-kZmsYB fQnjNb"
>
<div
class="sc-iGPElx gCHnuu"
>
<div
class="sc-kasBVs lhkNTc"
>
<div
class="sc-iSDuPN iRujPb"
>
<div
class="sc-hgHYgh dHoKCw"
>
<img
alt="cashtab"
class="sc-eInJlc eaQkcG"
src="test-file-stub"
/>
<div
class="sc-hzDEsm rASrW"
>
Settings
<svg
height="33px"
width="30px"
/>
</div>
</div>
<div
class="sc-bYSBpT dbDmUC"
data-testid="wallet-info-ctn"
>
<div
class="sc-chbbiW htWHZo"
>
<div
class="sc-kxynE kQEGv"
>
[Burned] useWallet Mock
</div>
<div>
<button
aria-checked="true"
class="ant-switch ant-switch-small css-dev-only-do-not-override-1rqnfsa ant-switch-checked"
role="switch"
type="button"
>
<div
class="ant-switc...
at waitForWrapper (/work/cashtab/node_modules/@testing-library/dom/dist/wait-for.js:163:27)
at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:86:33
at Object.findByText (/work/cashtab/src/components/__tests__/App.test.js:407:29)
at runNextTicks (node:internal/process/task_queues:60:5)
at listOnTimeout (node:internal/timers:540:9)
at processTimers (node:internal/timers:514:7)
====== CashTab Unit Tests: <App /> Setting "Send Confirmations" settings will show send confirmations ======
Error: Unable to find an element with the text: Are you sure you want to send 55 XEC to ecash:qphlhe78677sz227k83hrh542qeehh8el5lcjwk72y?. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, script, style
<body>
<div>
<div
class="ant-spin-nested-loading css-dev-only-do-not-override-1rqnfsa"
>
<div
class="ant-spin-container"
>
<div
class="sc-kZmsYB fQnjNb"
>
<div
class="sc-iGPElx gCHnuu"
>
<div
class="sc-kasBVs lhkNTc"
>
<div
class="sc-iSDuPN iRujPb"
>
<div
class="sc-hgHYgh dHoKCw"
>
<img
alt="cashtab"
class="sc-eInJlc eaQkcG"
src="test-file-stub"
/>
</div>
<div
class="sc-bYSBpT dbDmUC"
data-testid="wallet-info-ctn"
>
<div
class="sc-chbbiW htWHZo"
>
<div
class="sc-kxynE kQEGv"
>
Transaction Fixtures
</div>
<div>
<button
aria-checked="true"
class="ant-switch ant-switch-small css-dev-only-do-not-override-1rqnfsa ant-switch-checked"
role="switch"
type="button"
>
<div
class="ant-switch-handle"
/>
<span
class="ant-switch-inner"
>
<span
class="ant-switch-inner-checked"
>
<svg
class="sc-cSHVUG bgwEHu"
/>
</span>
<span
class="ant-switch-inner-unchecked"
>
<svg
class="sc-kAzzGY fUTkYj"
/>
</span>
</span>
</button>
</div>
</div>
<div
class="sc-cooIXK Gxkby"
data-testid="balance-xec"
>
9,513.12
XEC
</div>
<div
class="sc-fcdeBU eNHrWm"
data-testid="balance-fiat"
>
$
0.29
USD
</div>
<p
class="sc-gmeYpB ddoKuI"
data-testid="ecash-price"
>
1
XEC
=
0.00003000
USD
</p>
</div>
</div>
<div
class="sc-btzYZH hekFVg"
data-testid="send-xec-ctn"
>
<div
class="ant-row css-dev-only-do-not-override-1rqnfsa"
type="flex"
>
<div
class="ant-col ant-col-24 css-dev-only-do-not-override-1rqnfsa"
>
<form
class="ant-form ant-form-horizontal css-dev-only-do-not-override-1rqnfsa"
style="width: auto; margin-top: 40px;"
>
<div
class="sc-iujRgT bugtRy"
>
<label
class="sc-lhVmIH ffziWj"
>
Send to
</label>
<div
class="sc-hMFtBS hvGbKu"
>
Multiple Recipients:
<button
aria-checked="false"
class="ant-switch css-dev-only-do-not-override-1rqnfsa"
data-testid="multiple-recipients-switch"
defaultunchecked="true"
role="switch"
style="margin-bottom: 7px;"
type="button"
>
<div
class="ant-switch-handle"
/>
<span
class="ant-switch-inner"
>
<span
class="ant-switch-inner-checked"
/>
...
at waitForWrapper (/work/cashtab/node_modules/@testing-library/dom/dist/wait-for.js:163:27)
at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:86:33
at Object.findByText (/work/cashtab/src/components/__tests__/App.test.js:481:26)
====== CashTab Unit Tests: <App /> Setting "ABSOLUTE MINIMUM fees" settings will reduce fees to absolute min ======
Error: Unable to find an element with the text: Transaction successful. Click to view in block explorer.. This could be because the text is broken up by multiple elements. In this case, you can provide a function for your text matcher to make your matcher more flexible.
Ignored nodes: comments, script, style
<body>
<div>
<div
class="ant-spin-nested-loading css-dev-only-do-not-override-1rqnfsa"
>
<div
class="ant-spin-container"
>
<div
class="sc-kZmsYB fQnjNb"
>
<div
class="sc-iGPElx gCHnuu"
>
<div
class="sc-kasBVs lhkNTc"
>
<div
class="sc-iSDuPN iRujPb"
>
<div
class="sc-hgHYgh dHoKCw"
>
<img
alt="cashtab"
class="sc-eInJlc eaQkcG"
src="test-file-stub"
/>
</div>
<div
class="sc-bYSBpT dbDmUC"
data-testid="wallet-info-ctn"
>
<div
class="sc-chbbiW htWHZo"
>
<div
class="sc-kxynE kQEGv"
>
Transaction Fixtures
</div>
<div>
<button
aria-checked="true"
class="ant-switch ant-switch-small css-dev-only-do-not-override-1rqnfsa ant-switch-checked"
role="switch"
type="button"
>
<div
class="ant-switch-handle"
/>
<span
class="ant-switch-inner"
>
<span
class="ant-switch-inner-checked"
>
<svg
class="sc-cSHVUG bgwEHu"
/>
</span>
<span
class="ant-switch-inner-unchecked"
>
<svg
class="sc-kAzzGY fUTkYj"
/>
</span>
</span>
</button>
</div>
</div>
<div
class="sc-cooIXK Gxkby"
data-testid="balance-xec"
>
9,513.12
XEC
</div>
<div
class="sc-fcdeBU eNHrWm"
data-testid="balance-fiat"
>
$
0.29
USD
</div>
<p
class="sc-gmeYpB ddoKuI"
data-testid="ecash-price"
>
1
XEC
=
0.00003000
USD
</p>
</div>
</div>
<div
class="sc-btzYZH hekFVg"
data-testid="send-xec-ctn"
>
<div
class="ant-row css-dev-only-do-not-override-1rqnfsa"
type="flex"
>
<div
class="ant-col ant-col-24 css-dev-only-do-not-override-1rqnfsa"
>
<form
class="ant-form ant-form-horizontal css-dev-only-do-not-override-1rqnfsa"
style="width: auto; margin-top: 40px;"
>
<div
class="sc-iujRgT bugtRy"
>
<label
class="sc-lhVmIH ffziWj"
>
Send to
</label>
<div
class="sc-hMFtBS hvGbKu"
>
Multiple Recipients:
<button
aria-checked="false"
class="ant-switch css-dev-only-do-not-override-1rqnfsa"
data-testid="multiple-recipients-switch"
defaultunchecked="true"
role="switch"
style="margin-bottom: 7px;"
type="button"
>
<div
class="ant-switch-handle"
/>
<span
class="ant-switch-inner"
>
<span
class="ant-switch-inner-checked"
/>
...
at waitForWrapper (/work/cashtab/node_modules/@testing-library/dom/dist/wait-for.js:163:27)
at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:86:33
at Object.findByText (/work/cashtab/src/components/__tests__/App.test.js:624:52)Each failure log is accessible here:
CashTab Unit Tests: <App /> We do see the camera auto-open setting in the config screen on a mobile device
CashTab Unit Tests: <App /> Setting "Send Confirmations" settings will show send confirmations
CashTab Unit Tests: <App /> Setting "ABSOLUTE MINIMUM fees" settings will reduce fees to absolute min