feat: webauthn test flows (#883)

## Summary of change

This PR adds e2e test flows for webauthn and accountlinking

## Related issues

## Test Plan

All webauthn accountlinking tests should pass

## Documentation changes

(If relevant, please create a PR in our [docs repo](https://github.com/supertokens/docs), or create a checklist here highlighting the necessary changes)

## Checklist for important updates

-   [ ] Changelog has been updated
-   [ ] `frontendDriverInterfaceSupported.json` file has been updated (if needed)
-   [ ] Changes to the version if needed
    -   In `package.json`
    -   In `package-lock.json`
    -   In `lib/ts/version.ts`
-   [x] Had run `npm run build-pretty`
-   [x] Had installed and ran the pre-commit hook
-   [x] Issue this PR against the latest non released version branch.
    -   To know which one it is, run find the latest released tag (`git tag`) in the format `vX.Y.Z`, and then find the latest branch (`git branch --all`) whose `X.Y` is greater than the latest released tag.
    -   If no such branch exists, then create one from the latest released branch.
-   [ ] If added a new recipe interface, then make sure that the implementation of it uses NON arrow functions only (like `someFunc: function () {..}`).
-   [ ] If I added a new recipe, I also added the recipe entry point into the `size-limit` section of `package.json` with the size limit set to the current size rounded up.
-   [ ] If I added a new recipe, I also added the recipe entry point into the `rollup.config.mjs`
-   [ ] If I added a new login method, I modified the list in `lib/ts/types.ts`
-   [ ] If I added a factor id, I modified the list in `lib/ts/recipe/multifactorauth/types.ts`

Author: deepjyoti30-st

.github/workflows/pre-commit-hook-run.yml

@@ -12,15 +12,8 @@ jobs:
     pr-title:
         name: Pre commit hook check
         runs-on: ubuntu-latest
-        container: rishabhpoddar/supertokens_website_sdk_testing_node_16
         steps:
-            - uses: actions/checkout@v2
-            - run: git init && git add --all && git -c user.name='test' -c user.email='[email protected]' commit -m 'init for pr action'
-            - run: npm i --force || true
-            # the below command is there cause otherwise running npm run check-circular-dependencies gives an error like:
-            #   Your cache folder contains root-owned files, due to a bug in
-            #   npm ERR! previous versions of npm which has since been addressed.
-            - run: chown -R 1001:121 "/github/home/.npm"
-            - run: npm i --force
-            - run: cd test/with-typescript && npm i --force
+            - uses: actions/checkout@v4
+            - run: npm ci
+            - run: cd test/with-typescript && npm ci
             - run: ./hooks/pre-commit.sh

.github/workflows/test-examples.yml

@@ -6,7 +6,7 @@ jobs:
         outputs:
             matrix: ${{ steps.set-matrix.outputs.matrix }}
         steps:
-            - uses: actions/checkout@v2
+            - uses: actions/checkout@v4
             - run: bash test/findExamplesWithTests.sh
             - id: set-matrix
               run: echo "::set-output name=matrix::{\"include\":$(bash test/findExamplesWithTests.sh)}"
@@ -24,7 +24,7 @@ jobs:
             run:
                 working-directory: ${{ matrix.examplePath }}
         steps:
-            - uses: actions/checkout@v2
+            - uses: actions/checkout@v4
             - run: bash ../../test/updateExampleAppDeps.sh .
             - run: npm install [email protected] [email protected] puppeteer@^11.0.0 isomorphic-fetch@^3.0.0
             - run: npm run build || true
@@ -36,7 +36,7 @@ jobs:
                   )
             - name: The job has failed
               if: ${{ failure() }}
-              uses: actions/upload-artifact@v3
+              uses: actions/upload-artifact@v4
               with:
                   name: screenshots
                   path: ./**/*screenshot.jpeg

.github/workflows/tests-pass-check-pr.yml

@@ -54,6 +54,7 @@ export const LinkingPage: React.FC = () => {
         try {
             let response = await Passwordless.createCode({
                 phoneNumber,
+                shouldTryLinkingWithSessionUser: true,
             });
 
             if (cancel) {

examples/with-account-linking/frontend/src/LinkingPage/index.tsx

@@ -15,7 +15,7 @@
         "react-dom": "^18.2.0",
         "react-router-dom": "^6.2.1",
         "react-scripts": "5.0.1",
-        "supertokens-auth-react": "github:supertokens/supertokens-auth-react#feat/mfa_redirect",
+        "supertokens-auth-react": "github:supertokens/supertokens-auth-react",
         "supertokens-web-js": "latest",
         "typescript": "^4.8.2",
         "web-vitals": "^2.1.4"

examples/with-multifactorauth-phone-chooser/frontend/package.json

@@ -23,7 +23,10 @@ export default function SelectPhone() {
                         navigate: nav,
                     });
                 } else if (loadedInfo.user.phoneNumbers.length === 1) {
-                    await Passwordless.createCode({ phoneNumber: loadedInfo.user.phoneNumbers[0] });
+                    await Passwordless.createCode({
+                        phoneNumber: loadedInfo.user.phoneNumbers[0],
+                        shouldTryLinkingWithSessionUser: true,
+                    });
                     await MultiFactorAuth.redirectToFactor({
                         factorId: MultiFactorAuth.FactorIds.OTP_PHONE,
                         redirectBack: false,
@@ -60,7 +63,7 @@ export default function SelectPhone() {
                     <li
                         className="phoneNumberCard"
                         onClick={() => {
-                            Passwordless.createCode({ phoneNumber: number })
+                            Passwordless.createCode({ phoneNumber: number, shouldTryLinkingWithSessionUser: true })
                                 .then(async (info) => {
                                     if (info.status !== "OK") {
                                         setError(info.reason);
@@ -72,6 +75,7 @@ export default function SelectPhone() {
                                                 contactMethod: "PHONE",
                                                 contactInfo: number,
                                                 hasOtherPhoneNumbers: true,
+                                                shouldTryLinkingWithSessionUser: true,
                                             },
                                         });
                                         return MultiFactorAuth.redirectToFactor({

examples/with-multifactorauth-phone-chooser/frontend/src/SelectPhone/index.tsx

@@ -7,7 +7,7 @@ export function epOverride(oI: APIInterface): APIInterface {
         signInPOST: async function (input) {
             const emailField = input.formFields.find((f) => f.id === "email")!;
 
-            let primaryEmail = getPrimaryEmailFromInputEmail(emailField.value);
+            let primaryEmail = getPrimaryEmailFromInputEmail(emailField.value as string);
             if (primaryEmail !== undefined) {
                 emailField.value = primaryEmail;
             }
@@ -16,7 +16,7 @@ export function epOverride(oI: APIInterface): APIInterface {
         signUpPOST: async function (input) {
             const emailField = input.formFields.find((f) => f.id === "email")!;
 
-            let primaryEmail = getPrimaryEmailFromInputEmail(emailField.value);
+            let primaryEmail = getPrimaryEmailFromInputEmail(emailField.value as string);
             if (primaryEmail !== undefined) {
                 emailField.value = primaryEmail;
             }

examples/with-multiple-email-sign-in/api-server/epOverride.ts

@@ -77,7 +77,7 @@ supertokens.init({
                         // We format the phone number here to get it to a standard format
                         const emailField = input.formFields.find((field) => field.id === "email");
                         if (emailField) {
-                            const phoneNumber = parsePhoneNumber(emailField.value);
+                            const phoneNumber = parsePhoneNumber(emailField.value as string);
                             if (phoneNumber !== undefined && phoneNumber.isValid()) {
                                 emailField.value = phoneNumber.number;
                             }
@@ -93,7 +93,7 @@ supertokens.init({
                         // We format the phone number here to get it to a standard format
                         const emailField = input.formFields.find((field) => field.id === "email");
                         if (emailField) {
-                            const phoneNumber = parsePhoneNumber(emailField.value);
+                            const phoneNumber = parsePhoneNumber(emailField.value as string);
                             if (phoneNumber !== undefined && phoneNumber.isValid()) {
                                 emailField.value = phoneNumber.number;
                             }

examples/with-phone-password-mfa/api-server/index.ts

@@ -75,7 +75,7 @@ supertokens.init({
                         // We format the phone number here to get it to a standard format
                         const emailField = input.formFields.find((field) => field.id === "email");
                         if (emailField) {
-                            const phoneNumber = parsePhoneNumber(emailField.value);
+                            const phoneNumber = parsePhoneNumber(emailField.value as string);
                             if (phoneNumber !== undefined && phoneNumber.isValid()) {
                                 emailField.value = phoneNumber.number;
                             }
@@ -91,7 +91,7 @@ supertokens.init({
                         // We format the phone number here to get it to a standard format
                         const emailField = input.formFields.find((field) => field.id === "email");
                         if (emailField) {
-                            const phoneNumber = parsePhoneNumber(emailField.value);
+                            const phoneNumber = parsePhoneNumber(emailField.value as string);
                             if (phoneNumber !== undefined && phoneNumber.isValid()) {
                                 emailField.value = phoneNumber.number;
                             }

examples/with-phone-password/api-server/index.ts

@@ -43,6 +43,6 @@
         "sirv-cli": "^2.0.0",
         "supertokens-auth-react": "latest",
         "supertokens-node": "latest",
-        "svelte-navigator": "^3.1.5"
+        "svelte-navigator": "latest"
     }
 }