feat(g dbAuth): Detect WebAuthn support

.changesets/10864.md

@@ -0,0 +1,3 @@
+- feat(g dbAuth): Detect WebAuthn support (#10864) by @Tobbe
+
+Automatically add WebAuthn support to generated pages when WebAuthn is enabled for dbAuth

packages/cli/src/commands/generate/dbAuth/__tests__/dbAuth.mockListr.test.js

@@ -164,6 +164,75 @@ describe('dbAuth handler WebAuthn task title', () => {
     )
   })
 
+  it("does not prompt for WebAuthn if it's already set up", async () => {
+    const localMockFiles = { ...mockFiles }
+    localMockFiles[path.join(getPaths().web.src, 'auth.ts')] = `
+import { createDbAuthClient, createAuth } from '@redwoodjs/auth-dbauth-web'
+
+const dbAuthClient = createDbAuthClient()
+
+export const { AuthProvider, useAuth } = createAuth(dbAuthClient)
+`
+    localMockFiles[path.join(getPaths().web.base, 'package.json')] = `{
+  "name": "web",
+  "version": "0.0.0",
+  "private": true,
+  "dependencies": {
+    "@redwoodjs/auth-dbauth-web": "7.0.0",
+    "@simplewebauthn/browser": "7.4.0"
+  }
+}
+`
+
+    vol.reset()
+    vol.fromJSON(localMockFiles)
+
+    await dbAuth.handler({
+      listr2: { silentRendererCondition: true },
+      usernameLabel: 'email',
+      passwordLabel: 'password',
+    })
+
+    expect(mockSkippedTaskTitles[1]).toEqual(
+      'Querying WebAuthn addition: WebAuthn setup detected - ' +
+        'support will be included in pages',
+    )
+  })
+
+  it('does not prompt for WebAuthn if dbAuth is set up', async () => {
+    const localMockFiles = { ...mockFiles }
+    localMockFiles[path.join(getPaths().web.src, 'auth.ts')] = `
+import { createDbAuthClient, createAuth } from '@redwoodjs/auth-dbauth-web'
+
+const dbAuthClient = createDbAuthClient()
+
+export const { AuthProvider, useAuth } = createAuth(dbAuthClient)
+`
+    localMockFiles[path.join(getPaths().web.base, 'package.json')] = `{
+  "name": "web",
+  "version": "0.0.0",
+  "private": true,
+  "dependencies": {
+    "@redwoodjs/auth-dbauth-web": "7.0.0",
+  }
+}
+`
+
+    vol.reset()
+    vol.fromJSON(localMockFiles)
+
+    await dbAuth.handler({
+      listr2: { silentRendererCondition: true },
+      usernameLabel: 'email',
+      passwordLabel: 'password',
+    })
+
+    expect(mockSkippedTaskTitles[1]).toEqual(
+      'Querying WebAuthn addition: No WebAuthn setup detected - ' +
+        'support will not be included in pages',
+    )
+  })
+
   it('is correct after prompt answer "No"', async () => {
     const customEnquirer = new Enquirer({ show: false })
     customEnquirer.on('prompt', (prompt) => {

packages/cli/src/commands/generate/dbAuth/dbAuth.js

@@ -319,20 +319,48 @@ const tasks = ({
         title: 'Querying WebAuthn addition...',
         task: async (ctx, task) => {
           if (webauthn != null) {
+            // We enter here if the user passed the `--webauthn` flag. The flag
+            // always takes precedence.
+
+            ctx.webauthn = webauthn
+
             task.skip(
               `Querying WebAuthn addition: argument webauthn passed, WebAuthn${
                 webauthn ? '' : ' not'
               } included`,
             )
             return
           }
+
+          if (isDbAuthSetup()) {
+            if (isWebAuthnEnabled()) {
+              ctx.webauthn = webauthn = true
+
+              task.skip(
+                'Querying WebAuthn addition: WebAuthn setup detected - ' +
+                  'support will be included in pages',
+              )
+            } else {
+              ctx.webauthn = webauthn = false
+
+              task.skip(
+                'Querying WebAuthn addition: No WebAuthn setup detected - ' +
+                  'support will not be included in pages',
+              )
+            }
+
+            return
+          }
+
           const response = await task.prompt({
             type: 'confirm',
             name: 'answer',
             message: `Enable WebAuthn support (TouchID/FaceID) on LoginPage? See https://redwoodjs.com/docs/auth/dbAuth#webAuthn`,
             default: false,
           })
+
           ctx.webauthn = webauthn = response
+
           task.title = `Querying WebAuthn addition: WebAuthn addition${
             webauthn ? '' : ' not'
           } included`
@@ -436,3 +464,12 @@ function isDbAuthSetup() {
 
   return false
 }
+
+function isWebAuthnEnabled() {
+  const webPackageJson = fs.readFileSync(
+    path.join(getPaths().web.base, 'package.json'),
+    'utf-8',
+  )
+
+  return webPackageJson.includes('"@simplewebauthn/browser": ')
+}

packages/cli/src/lib/test.js

@@ -48,6 +48,7 @@ vi.mock('@redwoodjs/project-config', async (importOriginal) => {
           functions: path.join(BASE_PATH, './api/src/functions'),
         },
         web: {
+          base: path.join(BASE_PATH, './web'),
           config: path.join(BASE_PATH, './web/config'),
           src: path.join(BASE_PATH, './web/src'),
           generators: path.join(BASE_PATH, './web/generators'),