Page MenuHomePhabricator

[Cashtab] Add op return raw field to send xec screen
ClosedPublic

Authored by bytesofman on Apr 3 2024, 13:46.

Details

Reviewers
emack
Group Reviewers
Restricted Project
Commits
rABCeae9e734e4ed: [Cashtab] Add op return raw field to send xec screen
Summary

T3460

Add support for op_return_raw input to Cashtab's SendXec UI.

Currently, this can be set by bip21. However, it is confusing and scary when it is set this way, because there is no parsing of the op_return_raw string -- so the user does not know what the tx is.

Add parsing and render a preview window of the parsed op_return_raw. Support all protocols known to Cashtab.

Instead of the kind of useless "bip 21 alert" divs -- we now just configure the form the way a user would do manually and disable the inputs.

The "webapp tx request" is preserved, for now. Will clean this up in a separate diff.

Test Plan

npm test

This is live at https://cashtab-local-dev.netlify.app/

Test with extension

Diff Detail

Repository
rABC Bitcoin ABC
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

Better form, better validation, start writing a function to parse opreturnraw

Failed tests logs:

====== CashTab Unit Tests: <SendXec /> rendered with params in URL bip21 param - valid bip21 param with amount and op_return_raw is parsed as expected ======
Error: expect(element).not.toHaveStyle()

Compared values have no visual difference.
    at Object.toHaveStyle (/work/cashtab/src/components/Send/__tests__/SendByUrlParams.test.js:631:15)
====== CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with valid amount param to Send To field ======
TestingLibraryElementError: Unable to find an element with the text: (set by BIP21 query string). 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-fnwBNb ijhgYc"
        >
          <div
            class="Toastify"
          />
          <div
            class="sc-imABML wkodi"
          >
            <div
              class="sc-dRaagA gxmSjp"
            >
              <div
                class="sc-eAKXzc ajapJ"
              >
                <div
                  class="sc-fEUNkw fykeMU"
                >
                  <img
                    alt="cashtab"
                    class="sc-dREXXX bmoyPh"
                    src="test-file-stub"
                  />
                </div>
                <div
                  class="sc-dNLxif cuAnsK"
                  data-testid="wallet-info-ctn"
                >
                  <div
                    class="sc-gRnDUn hBPWtH"
                  >
                    <select
                      class="sc-cmjSyW drguGD"
                      id="wallets"
                      name="wallets"
                    >
                      <option
                        class="sc-sdtwF izmCOT"
                        value="Transaction Fixtures"
                      >
                        Transaction Fixtures
                      </option>
                    </select>
                    <div
                      class="sc-eNQAEJ kAwVTN"
                    >
                      <svg
                        class="sc-htoDjs dHRdfz"
                        style="margin-top: 8px;"
                      />
                    </div>
                    <div
                      class="sc-cbkKFq dbYZYK"
                    >
                      <div
                        class="sc-krvtoX uHAwC"
                      >
                        <input
                          checked=""
                          class="sc-gHboQg jlCboa"
                          data-testid="show-hide-balance"
                          id="show-hide-balance"
                          name="show-hide-balance"
                          type="checkbox"
                        />
                        <label
                          class="sc-fYiAbW gPWTJO"
                          for="show-hide-balance"
                        >
                          <span
                            class="sc-fOKMvo dvvywc"
                            data-off=""
                            data-on=""
                          />
                          <span
                            class="sc-dUjcNx etsZLo"
                          />
                        </label>
                      </div>
                    </div>
                  </div>
                  <div
                    class="sc-iYUSvU dXpvxB"
                    data-testid="balance-xec"
                  >
                    9,513.12
                     
                    XEC
                     
                  </div>
                  <div
                    class="sc-cHSUfg gGiuEm"
                    data-testid="balance-fiat"
                  >
                    $
                    0.29
                     
                    USD
                  </div>
                  <p
                    class="sc-cTjmhe gMQThc"
                    data-testid="ecash-price"
                  >
                    1 
                    XEC
                     = 
                    0.00003000
                     
                    USD
                  </p>
                </div>
              </div>
              <div
                class="sc-cjHlYL gOwAza"
              >
                <div
                  class="sc-krDsej bQhgvj"
                >
                  <div
                    class="sc-cbkKFq dbYZYK"
                  >
                    <div
                      class="sc-krvtoX hvfRMO"
                    >
                      <input
                        class="sc-gHboQg jlCboa"
                        data-testid="send-to-many-switch"
                        disabled=""
                        id="send-to-many-switch"
                        name="send-to-many-switch"
                        type="checkbox"
                      />
                      <label
                        class="sc-fYiAbW flaqVQ"
                        disabled=""
                        for="send-to-many-switch"
                      >
                        <span
                          class="sc-fOKMvo jnVFOj"
                          data-off="Send to one"
                          data-on="Send to many"
                        />
                        <span
                          class="sc-dUjcNx kCocaw"
                        />
                      </label>
                    </div>
        ...
    at Object.getElementError (/work/cashtab/node_modules/@testing-library/dom/dist/config.js:37:19)
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:95:19
    at Object.getByText (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:562:20)
====== CashTab Unit Tests: <SendXec /> Pass a valid alias and bip21 query string with valid amount param to Send To field ======
TestingLibraryElementError: Unable to find an element with the text: (set by BIP21 query string). 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-fnwBNb ijhgYc"
        >
          <div
            class="Toastify"
          />
          <div
            class="sc-imABML wkodi"
          >
            <div
              class="sc-dRaagA gxmSjp"
            >
              <div
                class="sc-eAKXzc ajapJ"
              >
                <div
                  class="sc-fEUNkw fykeMU"
                >
                  <img
                    alt="cashtab"
                    class="sc-dREXXX bmoyPh"
                    src="test-file-stub"
                  />
                </div>
                <div
                  class="sc-dNLxif cuAnsK"
                  data-testid="wallet-info-ctn"
                >
                  <div
                    class="sc-gRnDUn hBPWtH"
                  >
                    <select
                      class="sc-cmjSyW drguGD"
                      id="wallets"
                      name="wallets"
                    >
                      <option
                        class="sc-sdtwF izmCOT"
                        value="Transaction Fixtures"
                      >
                        Transaction Fixtures
                      </option>
                    </select>
                    <div
                      class="sc-eNQAEJ kAwVTN"
                    >
                      <svg
                        class="sc-htoDjs dHRdfz"
                        style="margin-top: 8px;"
                      />
                    </div>
                    <div
                      class="sc-cbkKFq dbYZYK"
                    >
                      <div
                        class="sc-krvtoX uHAwC"
                      >
                        <input
                          checked=""
                          class="sc-gHboQg jlCboa"
                          data-testid="show-hide-balance"
                          id="show-hide-balance"
                          name="show-hide-balance"
                          type="checkbox"
                        />
                        <label
                          class="sc-fYiAbW gPWTJO"
                          for="show-hide-balance"
                        >
                          <span
                            class="sc-fOKMvo dvvywc"
                            data-off=""
                            data-on=""
                          />
                          <span
                            class="sc-dUjcNx etsZLo"
                          />
                        </label>
                      </div>
                    </div>
                  </div>
                  <div
                    class="sc-iYUSvU dXpvxB"
                    data-testid="balance-xec"
                  >
                    9,513.12
                     
                    XEC
                     
                  </div>
                  <div
                    class="sc-cHSUfg gGiuEm"
                    data-testid="balance-fiat"
                  >
                    $
                    0.29
                     
                    USD
                  </div>
                  <p
                    class="sc-cTjmhe gMQThc"
                    data-testid="ecash-price"
                  >
                    1 
                    XEC
                     = 
                    0.00003000
                     
                    USD
                  </p>
                </div>
              </div>
              <div
                class="sc-cjHlYL gOwAza"
              >
                <div
                  class="sc-krDsej bQhgvj"
                >
                  <div
                    class="sc-cbkKFq dbYZYK"
                  >
                    <div
                      class="sc-krvtoX hvfRMO"
                    >
                      <input
                        class="sc-gHboQg jlCboa"
                        data-testid="send-to-many-switch"
                        disabled=""
                        id="send-to-many-switch"
                        name="send-to-many-switch"
                        type="checkbox"
                      />
                      <label
                        class="sc-fYiAbW flaqVQ"
                        disabled=""
                        for="send-to-many-switch"
                      >
                        <span
                          class="sc-fOKMvo jnVFOj"
                          data-off="Send to one"
                          data-on="Send to many"
                        />
                        <span
                          class="sc-dUjcNx kCocaw"
                        />
                      </label>
                    </div>
        ...
    at Object.getElementError (/work/cashtab/node_modules/@testing-library/dom/dist/config.js:37:19)
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:95:19
    at Object.getByText (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:636:20)
====== CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with invalid amount param (dust) to Send To field ======
TestingLibraryElementError: Unable to find an element with the text: (set by BIP21 query string). 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-fnwBNb ijhgYc"
        >
          <div
            class="Toastify"
          />
          <div
            class="sc-imABML wkodi"
          >
            <div
              class="sc-dRaagA gxmSjp"
            >
              <div
                class="sc-eAKXzc ajapJ"
              >
                <div
                  class="sc-fEUNkw fykeMU"
                >
                  <img
                    alt="cashtab"
                    class="sc-dREXXX bmoyPh"
                    src="test-file-stub"
                  />
                </div>
                <div
                  class="sc-dNLxif cuAnsK"
                  data-testid="wallet-info-ctn"
                >
                  <div
                    class="sc-gRnDUn hBPWtH"
                  >
                    <select
                      class="sc-cmjSyW drguGD"
                      id="wallets"
                      name="wallets"
                    >
                      <option
                        class="sc-sdtwF izmCOT"
                        value="Transaction Fixtures"
                      >
                        Transaction Fixtures
                      </option>
                    </select>
                    <div
                      class="sc-eNQAEJ kAwVTN"
                    >
                      <svg
                        class="sc-htoDjs dHRdfz"
                        style="margin-top: 8px;"
                      />
                    </div>
                    <div
                      class="sc-cbkKFq dbYZYK"
                    >
                      <div
                        class="sc-krvtoX uHAwC"
                      >
                        <input
                          checked=""
                          class="sc-gHboQg jlCboa"
                          data-testid="show-hide-balance"
                          id="show-hide-balance"
                          name="show-hide-balance"
                          type="checkbox"
                        />
                        <label
                          class="sc-fYiAbW gPWTJO"
                          for="show-hide-balance"
                        >
                          <span
                            class="sc-fOKMvo dvvywc"
                            data-off=""
                            data-on=""
                          />
                          <span
                            class="sc-dUjcNx etsZLo"
                          />
                        </label>
                      </div>
                    </div>
                  </div>
                  <div
                    class="sc-iYUSvU dXpvxB"
                    data-testid="balance-xec"
                  >
                    9,513.12
                     
                    XEC
                     
                  </div>
                  <div
                    class="sc-cHSUfg gGiuEm"
                    data-testid="balance-fiat"
                  >
                    $
                    0.29
                     
                    USD
                  </div>
                  <p
                    class="sc-cTjmhe gMQThc"
                    data-testid="ecash-price"
                  >
                    1 
                    XEC
                     = 
                    0.00003000
                     
                    USD
                  </p>
                </div>
              </div>
              <div
                class="sc-cjHlYL gOwAza"
              >
                <div
                  class="sc-krDsej bQhgvj"
                >
                  <div
                    class="sc-cbkKFq dbYZYK"
                  >
                    <div
                      class="sc-krvtoX hvfRMO"
                    >
                      <input
                        class="sc-gHboQg jlCboa"
                        data-testid="send-to-many-switch"
                        disabled=""
                        id="send-to-many-switch"
                        name="send-to-many-switch"
                        type="checkbox"
                      />
                      <label
                        class="sc-fYiAbW flaqVQ"
                        disabled=""
                        for="send-to-many-switch"
                      >
                        <span
                          class="sc-fOKMvo jnVFOj"
                          data-off="Send to one"
                          data-on="Send to many"
                        />
                        <span
                          class="sc-dUjcNx kCocaw"
                        />
                      </label>
                    </div>
        ...
    at Object.getElementError (/work/cashtab/node_modules/@testing-library/dom/dist/config.js:37:19)
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:95:19
    at Object.getByText (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:692:20)
====== CashTab Unit Tests: <SendXec /> Valid address with valid bip21 query string with valid amount param rejected if amount exceeds wallet balance ======
TestingLibraryElementError: Unable to find an element with the text: (set by BIP21 query string). 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-fnwBNb ijhgYc"
        >
          <div
            class="Toastify"
          />
          <div
            class="sc-imABML wkodi"
          >
            <div
              class="sc-dRaagA gxmSjp"
            >
              <div
                class="sc-eAKXzc ajapJ"
              >
                <div
                  class="sc-fEUNkw fykeMU"
                >
                  <img
                    alt="cashtab"
                    class="sc-dREXXX bmoyPh"
                    src="test-file-stub"
                  />
                </div>
                <div
                  class="sc-dNLxif cuAnsK"
                  data-testid="wallet-info-ctn"
                >
                  <div
                    class="sc-gRnDUn hBPWtH"
                  >
                    <select
                      class="sc-cmjSyW drguGD"
                      id="wallets"
                      name="wallets"
                    >
                      <option
                        class="sc-sdtwF izmCOT"
                        value="Transaction Fixtures"
                      >
                        Transaction Fixtures
                      </option>
                    </select>
                    <div
                      class="sc-eNQAEJ kAwVTN"
                    >
                      <svg
                        class="sc-htoDjs dHRdfz"
                        style="margin-top: 8px;"
                      />
                    </div>
                    <div
                      class="sc-cbkKFq dbYZYK"
                    >
                      <div
                        class="sc-krvtoX uHAwC"
                      >
                        <input
                          checked=""
                          class="sc-gHboQg jlCboa"
                          data-testid="show-hide-balance"
                          id="show-hide-balance"
                          name="show-hide-balance"
                          type="checkbox"
                        />
                        <label
                          class="sc-fYiAbW gPWTJO"
                          for="show-hide-balance"
                        >
                          <span
                            class="sc-fOKMvo dvvywc"
                            data-off=""
                            data-on=""
                          />
                          <span
                            class="sc-dUjcNx etsZLo"
                          />
                        </label>
                      </div>
                    </div>
                  </div>
                  <div
                    class="sc-iYUSvU dXpvxB"
                    data-testid="balance-xec"
                  >
                    9,513.12
                     
                    XEC
                     
                  </div>
                  <div
                    class="sc-cHSUfg gGiuEm"
                    data-testid="balance-fiat"
                  >
                    $
                    0.29
                     
                    USD
                  </div>
                  <p
                    class="sc-cTjmhe gMQThc"
                    data-testid="ecash-price"
                  >
                    1 
                    XEC
                     = 
                    0.00003000
                     
                    USD
                  </p>
                </div>
              </div>
              <div
                class="sc-cjHlYL gOwAza"
              >
                <div
                  class="sc-krDsej bQhgvj"
                >
                  <div
                    class="sc-cbkKFq dbYZYK"
                  >
                    <div
                      class="sc-krvtoX hvfRMO"
                    >
                      <input
                        class="sc-gHboQg jlCboa"
                        data-testid="send-to-many-switch"
                        disabled=""
                        id="send-to-many-switch"
                        name="send-to-many-switch"
                        type="checkbox"
                      />
                      <label
                        class="sc-fYiAbW flaqVQ"
                        disabled=""
                        for="send-to-many-switch"
                      >
                        <span
                          class="sc-fOKMvo jnVFOj"
                          data-off="Send to one"
                          data-on="Send to many"
                        />
                        <span
                          class="sc-dUjcNx kCocaw"
                        />
                      </label>
                    </div>
        ...
    at Object.getElementError (/work/cashtab/node_modules/@testing-library/dom/dist/config.js:37:19)
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:95:19
    at Object.getByText (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:746:20)
====== CashTab Unit Tests: <SendXec /> Pass a valid alias and bip21 query string with invalid amount param (too many decimals) to Send To field ======
TestingLibraryElementError: Unable to find an element with the text: (set by BIP21 query string). 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-fnwBNb ijhgYc"
        >
          <div
            class="Toastify"
          />
          <div
            class="sc-imABML wkodi"
          >
            <div
              class="sc-dRaagA gxmSjp"
            >
              <div
                class="sc-eAKXzc ajapJ"
              >
                <div
                  class="sc-fEUNkw fykeMU"
                >
                  <img
                    alt="cashtab"
                    class="sc-dREXXX bmoyPh"
                    src="test-file-stub"
                  />
                </div>
                <div
                  class="sc-dNLxif cuAnsK"
                  data-testid="wallet-info-ctn"
                >
                  <div
                    class="sc-gRnDUn hBPWtH"
                  >
                    <select
                      class="sc-cmjSyW drguGD"
                      id="wallets"
                      name="wallets"
                    >
                      <option
                        class="sc-sdtwF izmCOT"
                        value="Transaction Fixtures"
                      >
                        Transaction Fixtures
                      </option>
                    </select>
                    <div
                      class="sc-eNQAEJ kAwVTN"
                    >
                      <svg
                        class="sc-htoDjs dHRdfz"
                        style="margin-top: 8px;"
                      />
                    </div>
                    <div
                      class="sc-cbkKFq dbYZYK"
                    >
                      <div
                        class="sc-krvtoX uHAwC"
                      >
                        <input
                          checked=""
                          class="sc-gHboQg jlCboa"
                          data-testid="show-hide-balance"
                          id="show-hide-balance"
                          name="show-hide-balance"
                          type="checkbox"
                        />
                        <label
                          class="sc-fYiAbW gPWTJO"
                          for="show-hide-balance"
                        >
                          <span
                            class="sc-fOKMvo dvvywc"
                            data-off=""
                            data-on=""
                          />
                          <span
                            class="sc-dUjcNx etsZLo"
                          />
                        </label>
                      </div>
                    </div>
                  </div>
                  <div
                    class="sc-iYUSvU dXpvxB"
                    data-testid="balance-xec"
                  >
                    9,513.12
                     
                    XEC
                     
                  </div>
                  <div
                    class="sc-cHSUfg gGiuEm"
                    data-testid="balance-fiat"
                  >
                    $
                    0.29
                     
                    USD
                  </div>
                  <p
                    class="sc-cTjmhe gMQThc"
                    data-testid="ecash-price"
                  >
                    1 
                    XEC
                     = 
                    0.00003000
                     
                    USD
                  </p>
                </div>
              </div>
              <div
                class="sc-cjHlYL gOwAza"
              >
                <div
                  class="sc-krDsej bQhgvj"
                >
                  <div
                    class="sc-cbkKFq dbYZYK"
                  >
                    <div
                      class="sc-krvtoX hvfRMO"
                    >
                      <input
                        class="sc-gHboQg jlCboa"
                        data-testid="send-to-many-switch"
                        disabled=""
                        id="send-to-many-switch"
                        name="send-to-many-switch"
                        type="checkbox"
                      />
                      <label
                        class="sc-fYiAbW flaqVQ"
                        disabled=""
                        for="send-to-many-switch"
                      >
                        <span
                          class="sc-fOKMvo jnVFOj"
                          data-off="Send to one"
                          data-on="Send to many"
                        />
                        <span
                          class="sc-dUjcNx kCocaw"
                        />
                      </label>
                    </div>
        ...
    at Object.getElementError (/work/cashtab/node_modules/@testing-library/dom/dist/config.js:37:19)
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:95:19
    at Object.getByText (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:821:20)
====== CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with op_return_raw param to Send To field ======
TestingLibraryElementError: Unable to find an element with the text: Hex OP_RETURN "0401020304" set by BIP21. 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-fnwBNb ijhgYc"
        >
          <div
            class="Toastify"
          />
          <div
            class="sc-imABML wkodi"
          >
            <div
              class="sc-dRaagA gxmSjp"
            >
              <div
                class="sc-eAKXzc ajapJ"
              >
                <div
                  class="sc-fEUNkw fykeMU"
                >
                  <img
                    alt="cashtab"
                    class="sc-dREXXX bmoyPh"
                    src="test-file-stub"
                  />
                </div>
                <div
                  class="sc-dNLxif cuAnsK"
                  data-testid="wallet-info-ctn"
                >
                  <div
                    class="sc-gRnDUn hBPWtH"
                  >
                    <select
                      class="sc-cmjSyW drguGD"
                      id="wallets"
                      name="wallets"
                    >
                      <option
                        class="sc-sdtwF izmCOT"
                        value="Transaction Fixtures"
                      >
                        Transaction Fixtures
                      </option>
                    </select>
                    <div
                      class="sc-eNQAEJ kAwVTN"
                    >
                      <svg
                        class="sc-htoDjs dHRdfz"
                        style="margin-top: 8px;"
                      />
                    </div>
                    <div
                      class="sc-cbkKFq dbYZYK"
                    >
                      <div
                        class="sc-krvtoX uHAwC"
                      >
                        <input
                          checked=""
                          class="sc-gHboQg jlCboa"
                          data-testid="show-hide-balance"
                          id="show-hide-balance"
                          name="show-hide-balance"
                          type="checkbox"
                        />
                        <label
                          class="sc-fYiAbW gPWTJO"
                          for="show-hide-balance"
                        >
                          <span
                            class="sc-fOKMvo dvvywc"
                            data-off=""
                            data-on=""
                          />
                          <span
                            class="sc-dUjcNx etsZLo"
                          />
                        </label>
                      </div>
                    </div>
                  </div>
                  <div
                    class="sc-iYUSvU dXpvxB"
                    data-testid="balance-xec"
                  >
                    9,513.12
                     
                    XEC
                     
                  </div>
                  <div
                    class="sc-cHSUfg gGiuEm"
                    data-testid="balance-fiat"
                  >
                    $
                    0.29
                     
                    USD
                  </div>
                  <p
                    class="sc-cTjmhe gMQThc"
                    data-testid="ecash-price"
                  >
                    1 
                    XEC
                     = 
                    0.00003000
                     
                    USD
                  </p>
                </div>
              </div>
              <div
                class="sc-cjHlYL gOwAza"
              >
                <div
                  class="sc-krDsej bQhgvj"
                >
                  <div
                    class="sc-cbkKFq dbYZYK"
                  >
                    <div
                      class="sc-krvtoX hvfRMO"
                    >
                      <input
                        class="sc-gHboQg jlCboa"
                        data-testid="send-to-many-switch"
                        disabled=""
                        id="send-to-many-switch"
                        name="send-to-many-switch"
                        type="checkbox"
                      />
                      <label
                        class="sc-fYiAbW flaqVQ"
                        disabled=""
                        for="send-to-many-switch"
                      >
                        <span
                          class="sc-fOKMvo jnVFOj"
                          data-off="Send to one"
                          data-on="Send to many"
                        />
                        <span
                          class="sc-dUjcNx kCocaw"
                        />
                      </label>
                    </div>
        ...
    at Object.getElementError (/work/cashtab/node_modules/@testing-library/dom/dist/config.js:37:19)
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:95:19
    at Object.getByText (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:961:20)
====== CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with valid amount and op_return_raw params to Send To field ======
TestingLibraryElementError: Unable to find an element with the text: (set by BIP21 query string). 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-fnwBNb ijhgYc"
        >
          <div
            class="Toastify"
          />
          <div
            class="sc-imABML wkodi"
          >
            <div
              class="sc-dRaagA gxmSjp"
            >
              <div
                class="sc-eAKXzc ajapJ"
              >
                <div
                  class="sc-fEUNkw fykeMU"
                >
                  <img
                    alt="cashtab"
                    class="sc-dREXXX bmoyPh"
                    src="test-file-stub"
                  />
                </div>
                <div
                  class="sc-dNLxif cuAnsK"
                  data-testid="wallet-info-ctn"
                >
                  <div
                    class="sc-gRnDUn hBPWtH"
                  >
                    <select
                      class="sc-cmjSyW drguGD"
                      id="wallets"
                      name="wallets"
                    >
                      <option
                        class="sc-sdtwF izmCOT"
                        value="Transaction Fixtures"
                      >
                        Transaction Fixtures
                      </option>
                    </select>
                    <div
                      class="sc-eNQAEJ kAwVTN"
                    >
                      <svg
                        class="sc-htoDjs dHRdfz"
                        style="margin-top: 8px;"
                      />
                    </div>
                    <div
                      class="sc-cbkKFq dbYZYK"
                    >
                      <div
                        class="sc-krvtoX uHAwC"
                      >
                        <input
                          checked=""
                          class="sc-gHboQg jlCboa"
                          data-testid="show-hide-balance"
                          id="show-hide-balance"
                          name="show-hide-balance"
                          type="checkbox"
                        />
                        <label
                          class="sc-fYiAbW gPWTJO"
                          for="show-hide-balance"
                        >
                          <span
                            class="sc-fOKMvo dvvywc"
                            data-off=""
                            data-on=""
                          />
                          <span
                            class="sc-dUjcNx etsZLo"
                          />
                        </label>
                      </div>
                    </div>
                  </div>
                  <div
                    class="sc-iYUSvU dXpvxB"
                    data-testid="balance-xec"
                  >
                    9,513.12
                     
                    XEC
                     
                  </div>
                  <div
                    class="sc-cHSUfg gGiuEm"
                    data-testid="balance-fiat"
                  >
                    $
                    0.29
                     
                    USD
                  </div>
                  <p
                    class="sc-cTjmhe gMQThc"
                    data-testid="ecash-price"
                  >
                    1 
                    XEC
                     = 
                    0.00003000
                     
                    USD
                  </p>
                </div>
              </div>
              <div
                class="sc-cjHlYL gOwAza"
              >
                <div
                  class="sc-krDsej bQhgvj"
                >
                  <div
                    class="sc-cbkKFq dbYZYK"
                  >
                    <div
                      class="sc-krvtoX hvfRMO"
                    >
                      <input
                        class="sc-gHboQg jlCboa"
                        data-testid="send-to-many-switch"
                        disabled=""
                        id="send-to-many-switch"
                        name="send-to-many-switch"
                        type="checkbox"
                      />
                      <label
                        class="sc-fYiAbW flaqVQ"
                        disabled=""
                        for="send-to-many-switch"
                      >
                        <span
                          class="sc-fOKMvo jnVFOj"
                          data-off="Send to one"
                          data-on="Send to many"
                        />
                        <span
                          class="sc-dUjcNx kCocaw"
                        />
                      </label>
                    </div>
        ...
    at Object.getElementError (/work/cashtab/node_modules/@testing-library/dom/dist/config.js:37:19)
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:95:19
    at Object.getByText (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:1016:20)
====== CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with valid amount and invalid op_return_raw params to Send To field ======
TestingLibraryElementError: Unable to find an element with the text: Invalid op_return_raw param "notahexstring". 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-fnwBNb ijhgYc"
        >
          <div
            class="Toastify"
          />
          <div
            class="sc-imABML wkodi"
          >
            <div
              class="sc-dRaagA gxmSjp"
            >
              <div
                class="sc-eAKXzc ajapJ"
              >
                <div
                  class="sc-fEUNkw fykeMU"
                >
                  <img
                    alt="cashtab"
                    class="sc-dREXXX bmoyPh"
                    src="test-file-stub"
                  />
                </div>
                <div
                  class="sc-dNLxif cuAnsK"
                  data-testid="wallet-info-ctn"
                >
                  <div
                    class="sc-gRnDUn hBPWtH"
                  >
                    <select
                      class="sc-cmjSyW drguGD"
                      id="wallets"
                      name="wallets"
                    >
                      <option
                        class="sc-sdtwF izmCOT"
                        value="Transaction Fixtures"
                      >
                        Transaction Fixtures
                      </option>
                    </select>
                    <div
                      class="sc-eNQAEJ kAwVTN"
                    >
                      <svg
                        class="sc-htoDjs dHRdfz"
                        style="margin-top: 8px;"
                      />
                    </div>
                    <div
                      class="sc-cbkKFq dbYZYK"
                    >
                      <div
                        class="sc-krvtoX uHAwC"
                      >
                        <input
                          checked=""
                          class="sc-gHboQg jlCboa"
                          data-testid="show-hide-balance"
                          id="show-hide-balance"
                          name="show-hide-balance"
                          type="checkbox"
                        />
                        <label
                          class="sc-fYiAbW gPWTJO"
                          for="show-hide-balance"
                        >
                          <span
                            class="sc-fOKMvo dvvywc"
                            data-off=""
                            data-on=""
                          />
                          <span
                            class="sc-dUjcNx etsZLo"
                          />
                        </label>
                      </div>
                    </div>
                  </div>
                  <div
                    class="sc-iYUSvU dXpvxB"
                    data-testid="balance-xec"
                  >
                    9,513.12
                     
                    XEC
                     
                  </div>
                  <div
                    class="sc-cHSUfg gGiuEm"
                    data-testid="balance-fiat"
                  >
                    $
                    0.29
                     
                    USD
                  </div>
                  <p
                    class="sc-cTjmhe gMQThc"
                    data-testid="ecash-price"
                  >
                    1 
                    XEC
                     = 
                    0.00003000
                     
                    USD
                  </p>
                </div>
              </div>
              <div
                class="sc-cjHlYL gOwAza"
              >
                <div
                  class="sc-krDsej bQhgvj"
                >
                  <div
                    class="sc-cbkKFq dbYZYK"
                  >
                    <div
                      class="sc-krvtoX hvfRMO"
                    >
                      <input
                        class="sc-gHboQg jlCboa"
                        data-testid="send-to-many-switch"
                        disabled=""
                        id="send-to-many-switch"
                        name="send-to-many-switch"
                        type="checkbox"
                      />
                      <label
                        class="sc-fYiAbW flaqVQ"
                        disabled=""
                        for="send-to-many-switch"
                      >
                        <span
                          class="sc-fOKMvo jnVFOj"
                          data-off="Send to one"
                          data-on="Send to many"
                        />
                        <span
                          class="sc-dUjcNx kCocaw"
                        />
                      </label>
                    </div>
        ...
    at Object.getElementError (/work/cashtab/node_modules/@testing-library/dom/dist/config.js:37:19)
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:109:15
    at Object.getAllByText (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:1069:20)
====== CashTab Unit Tests: <SendXec /> Clicking "Send" will send a valid tx with op_return_raw after entry of a valid address and bip21 query string with valid amount and op_return_raw params to Send To field ======
Error: expect(element).not.toHaveStyle()

Compared values have no visual difference.
    at Object.toHaveStyle (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:1154:66)
====== CashTab Unit Tests: <SendXec /> If the user has minFeeSends set to true but no longer has the right token amount, the feature is disabled ======
Error: expect(element).not.toHaveStyle()

Compared values have no visual difference.
    at Object.toHaveStyle (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:1382:66)

Each failure log is accessible here:
CashTab Unit Tests: <SendXec /> rendered with params in URL bip21 param - valid bip21 param with amount and op_return_raw is parsed as expected
CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with valid amount param to Send To field
CashTab Unit Tests: <SendXec /> Pass a valid alias and bip21 query string with valid amount param to Send To field
CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with invalid amount param (dust) to Send To field
CashTab Unit Tests: <SendXec /> Valid address with valid bip21 query string with valid amount param rejected if amount exceeds wallet balance
CashTab Unit Tests: <SendXec /> Pass a valid alias and bip21 query string with invalid amount param (too many decimals) to Send To field
CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with op_return_raw param to Send To field
CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with valid amount and op_return_raw params to Send To field
CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with valid amount and invalid op_return_raw params to Send To field
CashTab Unit Tests: <SendXec /> Clicking "Send" will send a valid tx with op_return_raw after entry of a valid address and bip21 query string with valid amount and op_return_raw params to Send To field
CashTab Unit Tests: <SendXec /> If the user has minFeeSends set to true but no longer has the right token amount, the feature is disabled

Support parsed preview window, improve unit tests, update integration tests

Failed tests logs:

====== CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with valid amount and invalid op_return_raw params to Send To field ======
TestingLibraryElementError: Unable to find an element with the text: Invalid OP_RETURN. 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-fnwBNb ijhgYc"
        >
          <div
            class="Toastify"
          />
          <div
            class="sc-imABML wkodi"
          >
            <div
              class="sc-dRaagA gxmSjp"
            >
              <div
                class="sc-eAKXzc ajapJ"
              >
                <div
                  class="sc-fEUNkw fykeMU"
                >
                  <img
                    alt="cashtab"
                    class="sc-dREXXX bmoyPh"
                    src="test-file-stub"
                  />
                </div>
                <div
                  class="sc-dNLxif cuAnsK"
                  data-testid="wallet-info-ctn"
                >
                  <div
                    class="sc-gRnDUn hBPWtH"
                  >
                    <select
                      class="sc-cmjSyW drguGD"
                      id="wallets"
                      name="wallets"
                    >
                      <option
                        class="sc-sdtwF izmCOT"
                        value="Transaction Fixtures"
                      >
                        Transaction Fixtures
                      </option>
                    </select>
                    <div
                      class="sc-eNQAEJ kAwVTN"
                    >
                      <svg
                        class="sc-htoDjs dHRdfz"
                        style="margin-top: 8px;"
                      />
                    </div>
                    <div
                      class="sc-cbkKFq dbYZYK"
                    >
                      <div
                        class="sc-krvtoX uHAwC"
                      >
                        <input
                          checked=""
                          class="sc-gHboQg jlCboa"
                          data-testid="show-hide-balance"
                          id="show-hide-balance"
                          name="show-hide-balance"
                          type="checkbox"
                        />
                        <label
                          class="sc-fYiAbW gPWTJO"
                          for="show-hide-balance"
                        >
                          <span
                            class="sc-fOKMvo dvvywc"
                            data-off=""
                            data-on=""
                          />
                          <span
                            class="sc-dUjcNx etsZLo"
                          />
                        </label>
                      </div>
                    </div>
                  </div>
                  <div
                    class="sc-iYUSvU dXpvxB"
                    data-testid="balance-xec"
                  >
                    9,513.12
                     
                    XEC
                     
                  </div>
                  <div
                    class="sc-cHSUfg gGiuEm"
                    data-testid="balance-fiat"
                  >
                    $
                    0.29
                     
                    USD
                  </div>
                  <p
                    class="sc-cTjmhe gMQThc"
                    data-testid="ecash-price"
                  >
                    1 
                    XEC
                     = 
                    0.00003000
                     
                    USD
                  </p>
                </div>
              </div>
              <div
                class="sc-cjHlYL gOwAza"
              >
                <div
                  class="sc-krDsej bQhgvj"
                >
                  <div
                    class="sc-cbkKFq dbYZYK"
                  >
                    <div
                      class="sc-krvtoX hvfRMO"
                    >
                      <input
                        class="sc-gHboQg jlCboa"
                        data-testid="send-to-many-switch"
                        disabled=""
                        id="send-to-many-switch"
                        name="send-to-many-switch"
                        type="checkbox"
                      />
                      <label
                        class="sc-fYiAbW flaqVQ"
                        disabled=""
                        for="send-to-many-switch"
                      >
                        <span
                          class="sc-fOKMvo jnVFOj"
                          data-off="Send to one"
                          data-on="Send to many"
                        />
                        <span
                          class="sc-dUjcNx kCocaw"
                        />
                      </label>
                    </div>
        ...
    at Object.getElementError (/work/cashtab/node_modules/@testing-library/dom/dist/config.js:37:19)
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:95:19
    at Object.getByText (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:1004:23)

Each failure log is accessible here:
CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with valid amount and invalid op_return_raw params to Send To field

document function, complete TODO in sendbyurlparams tests

Failed tests logs:

====== CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with valid amount and invalid op_return_raw params to Send To field ======
TestingLibraryElementError: Unable to find an element with the text: Invalid OP_RETURN. 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-fnwBNb ijhgYc"
        >
          <div
            class="Toastify"
          />
          <div
            class="sc-imABML wkodi"
          >
            <div
              class="sc-dRaagA gxmSjp"
            >
              <div
                class="sc-eAKXzc ajapJ"
              >
                <div
                  class="sc-fEUNkw fykeMU"
                >
                  <img
                    alt="cashtab"
                    class="sc-dREXXX bmoyPh"
                    src="test-file-stub"
                  />
                </div>
                <div
                  class="sc-dNLxif cuAnsK"
                  data-testid="wallet-info-ctn"
                >
                  <div
                    class="sc-gRnDUn hBPWtH"
                  >
                    <select
                      class="sc-cmjSyW drguGD"
                      id="wallets"
                      name="wallets"
                    >
                      <option
                        class="sc-sdtwF izmCOT"
                        value="Transaction Fixtures"
                      >
                        Transaction Fixtures
                      </option>
                    </select>
                    <div
                      class="sc-eNQAEJ kAwVTN"
                    >
                      <svg
                        class="sc-htoDjs dHRdfz"
                        style="margin-top: 8px;"
                      />
                    </div>
                    <div
                      class="sc-cbkKFq dbYZYK"
                    >
                      <div
                        class="sc-krvtoX uHAwC"
                      >
                        <input
                          checked=""
                          class="sc-gHboQg jlCboa"
                          data-testid="show-hide-balance"
                          id="show-hide-balance"
                          name="show-hide-balance"
                          type="checkbox"
                        />
                        <label
                          class="sc-fYiAbW gPWTJO"
                          for="show-hide-balance"
                        >
                          <span
                            class="sc-fOKMvo dvvywc"
                            data-off=""
                            data-on=""
                          />
                          <span
                            class="sc-dUjcNx etsZLo"
                          />
                        </label>
                      </div>
                    </div>
                  </div>
                  <div
                    class="sc-iYUSvU dXpvxB"
                    data-testid="balance-xec"
                  >
                    9,513.12
                     
                    XEC
                     
                  </div>
                  <div
                    class="sc-cHSUfg gGiuEm"
                    data-testid="balance-fiat"
                  >
                    $
                    0.29
                     
                    USD
                  </div>
                  <p
                    class="sc-cTjmhe gMQThc"
                    data-testid="ecash-price"
                  >
                    1 
                    XEC
                     = 
                    0.00003000
                     
                    USD
                  </p>
                </div>
              </div>
              <div
                class="sc-cjHlYL gOwAza"
              >
                <div
                  class="sc-krDsej bQhgvj"
                >
                  <div
                    class="sc-cbkKFq dbYZYK"
                  >
                    <div
                      class="sc-krvtoX hvfRMO"
                    >
                      <input
                        class="sc-gHboQg jlCboa"
                        data-testid="send-to-many-switch"
                        disabled=""
                        id="send-to-many-switch"
                        name="send-to-many-switch"
                        type="checkbox"
                      />
                      <label
                        class="sc-fYiAbW flaqVQ"
                        disabled=""
                        for="send-to-many-switch"
                      >
                        <span
                          class="sc-fOKMvo jnVFOj"
                          data-off="Send to one"
                          data-on="Send to many"
                        />
                        <span
                          class="sc-dUjcNx kCocaw"
                        />
                      </label>
                    </div>
        ...
    at Object.getElementError (/work/cashtab/node_modules/@testing-library/dom/dist/config.js:37:19)
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:76:38
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:52:17
    at /work/cashtab/node_modules/@testing-library/dom/dist/query-helpers.js:95:19
    at Object.getByText (/work/cashtab/src/components/Send/__tests__/SendXec.test.js:1004:23)

Each failure log is accessible here:
CashTab Unit Tests: <SendXec /> Pass a valid address and bip21 query string with valid amount and invalid op_return_raw params to Send To field

update expected error msg in integration test

bytesofman published this revision for review.Apr 3 2024, 23:58
bytesofman added inline comments.
cashtab/src/components/Common/Inputs.js
40 ↗(On Diff #46801)

This makes it more clear to the user when an input field is disabled by bip21

70 ↗(On Diff #46801)

Limit the size of the text area and improve scrolling css so we can fit more information on the send xec screen

cashtab/src/components/Common/Switch.js
36 ↗(On Diff #46801)

if a disabled switch is on, do not grey it out (which confusingly makes it look off). just show it is disabled with cursor not-allowed.

cashtab/src/components/Send/SendXec.js
977 ↗(On Diff #46801)

this shows 2 lines with no scrolling

imo, magic(-ish) numbers for style props are ok. it is clear enough this is a set pixel height from the prop name and the proptypes of the component.

cashtab/src/components/Send/__tests__/SendByUrlParams.test.js
625 ↗(On Diff #46801)

we only support lowercase hex input in cashtab

718 ↗(On Diff #46801)

this is no longer true with non-antd components. update here as we must update several impacted tests for the UI changes.

cashtab/src/opreturn/index.js
346 ↗(On Diff #46801)

function name change

cashtab/src/validation/__tests__/index.test.js
353 ↗(On Diff #46801)

since we update the name of this function and it is now used differently, move the unit tests to vectors

cashtab/src/validation/index.js
514 ↗(On Diff #46801)

This is a UI-driven function. We want to return a good error msg to the user if op_return_raw is invalid

546 ↗(On Diff #46801)

This is a backend-driven function. If we have no easy UI-parseable way to explain why the tx will not be accepted by the node, give an Invalid OP_RETURN error

Note: the node (or mb chronik? from Cashtab's perspective, could be either) will not accept a tx with OP_RETURN that does not meet OP_RETURN spec, i.e. you cannot push 6adeadbeef, but you can push 6a04deadbeef.

For the most part, this error means the pushdata is invalid. But I don't want to throw the word "pushdata" at a casual user.

emack added a subscriber: emack.

Manual op_return raw input works well

image.png (586×532 px, 57 KB)

eCash Chat messages look good

image.png (734×455 px, 46 KB)

Paybutton ecash land txs don't show the paybutton prefix which is expected since there is no utf-8 message being sent.

image.png (717×763 px, 96 KB)

Other protocol prefixes (e.g. cashtab msg, encrypted msg, airdrops) aren't expected to trigger the extension.

This revision is now accepted and ready to land.Apr 4 2024, 05:22