diff --git a/packages/access-api/src/utils/html.js b/packages/access-api/src/utils/html.js index c6762cd3e..45c63c5f3 100644 --- a/packages/access-api/src/utils/html.js +++ b/packages/access-api/src/utils/html.js @@ -39,16 +39,9 @@ export function buildDocument(body) { margin: 0 40px; padding: 40px 0; } - .fcenter { - display: flex; - align-items: center; - flex-direction: column; - justify-content: center; - } .mcenter { margin: 0 auto; } - .box { max-width: 640px; background-color: var(--background-alt); @@ -138,14 +131,18 @@ export const PendingValidateEmail = ({ autoApprove }) => ( * @param {string} [param0.qrcode] */ export const ValidateEmail = ({ ucan, qrcode, email, audience }) => ( -
- -

Email Validated

-

{email} was confirmed. You may close this window.

-
+
+
+ +

Email Validated

+

+ {email} was confirmed. You may close this window. +

+
+

If you have an existing non-w3up beta account with NFT.Storage or web3.storage and register for the w3up beta version of the same product @@ -162,16 +159,18 @@ export const ValidateEmail = ({ ucan, qrcode, email, audience }) => ( NFT.Storage ToS).

-
+
{' '} - More details -
Validation requested by:
-

+

Auth details +
Validation requested by
+
         {audience}
-      

+
{qrcode && ( <> -
QR Code:
+
QR Code
( /> )} -
UCAN:
+
UCAN
         {ucan}
       
diff --git a/packages/access-api/test/snapshots/.gitignore b/packages/access-api/test/snapshots/.gitignore new file mode 100644 index 000000000..0b84df0f0 --- /dev/null +++ b/packages/access-api/test/snapshots/.gitignore @@ -0,0 +1 @@ +*.html \ No newline at end of file diff --git a/packages/access-api/test/snapshots/README.md b/packages/access-api/test/snapshots/README.md new file mode 100644 index 000000000..575721268 --- /dev/null +++ b/packages/access-api/test/snapshots/README.md @@ -0,0 +1,17 @@ +## snapshots + +This is for low-fi html tweaking. Run the validation-email.test.js and it will write the latest html for that page here, so you can tweak it. + +```sh +# writes ./validation-email.html +$ pnpm test test/validate-email.test.js + +# peep it. tweak it. +$ open test/snapshots/validate-email.html +``` + +The html will change on every run, as we include ucan info. + +Full snapshot testing is not considered here as it is dull. + +A storybook for this project would be decent tho. diff --git a/packages/access-api/test/validate-email.test.js b/packages/access-api/test/validate-email.test.js index 0d98c2a02..066bd81bd 100644 --- a/packages/access-api/test/validate-email.test.js +++ b/packages/access-api/test/validate-email.test.js @@ -4,6 +4,7 @@ import { Delegation } from '@ucanto/core' import { Access } from '@web3-storage/capabilities' import { delegationToString } from '@web3-storage/access/encoding' import { getRandomValues } from 'crypto' +import { writeFileSync } from 'fs' describe('validate-email', () => { it('can POST /validate-email?mode=authorize', async () => { @@ -44,5 +45,7 @@ describe('validate-email', () => { method: 'post', }) assert.deepEqual(response.status, 200) + const relPath = new URL('snapshots/validate-email.html', import.meta.url) + writeFileSync(relPath, await response.text()) }) })