From 5fa1f9151689ec9918102813e02f837c4cee6e82 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Fri, 14 Oct 2022 11:03:23 +0100
Subject: [PATCH] refactor: migrate to hookable's `createDebugger`

---
 packages/nuxt/src/app/plugins/debug.ts        | 19 ++++---------------
 packages/nuxt/src/core/nitro.ts               |  8 ++++++++
 packages/nuxt/src/core/nuxt.ts                | 12 ++++++++++--
 .../src/core/runtime/nitro/plugins/debug.ts   | 11 +++--------
 4 files changed, 25 insertions(+), 25 deletions(-)

diff --git a/packages/nuxt/src/app/plugins/debug.ts b/packages/nuxt/src/app/plugins/debug.ts
index fe1180eaf2e..b04702a5204 100644
--- a/packages/nuxt/src/app/plugins/debug.ts
+++ b/packages/nuxt/src/app/plugins/debug.ts
@@ -1,20 +1,9 @@
+import { createDebugger } from 'hookable'
 import { defineNuxtPlugin } from '#app'
 
-const wrapName = (event: string) => process.server ? `[nuxt] ${event}` : event
-
 export default defineNuxtPlugin((nuxtApp) => {
-  nuxtApp.hooks.beforeEach(({ name }) => {
-    console.time(wrapName(name))
-  })
-
-  nuxtApp.hooks.afterEach(({ name, args }) => {
-    if (process.client) {
-      console.groupCollapsed(name)
-      console.timeLog(name, args)
-      console.groupEnd()
-    }
-    if (process.server) {
-      console.timeEnd(wrapName(name))
-    }
+  // @ts-expect-error remove in next version of hookable
+  createDebugger(nuxtApp.hooks, {
+    tag: 'nuxt app'
   })
 })
diff --git a/packages/nuxt/src/core/nitro.ts b/packages/nuxt/src/core/nitro.ts
index 42a156f4a5d..d76f2d88e7b 100644
--- a/packages/nuxt/src/core/nitro.ts
+++ b/packages/nuxt/src/core/nitro.ts
@@ -7,6 +7,7 @@ import { resolvePath } from '@nuxt/kit'
 import defu from 'defu'
 import fsExtra from 'fs-extra'
 import { toEventHandler, dynamicEventHandler } from 'h3'
+import { createDebugger } from 'hookable'
 import { distDir } from '../dirs'
 import { ImportProtectionPlugin } from './plugins/import-protection'
 
@@ -149,6 +150,13 @@ export async function initNitro (nuxt: Nuxt & { _nitro?: Nitro }) {
 
   // Connect hooks
   nuxt.hook('close', () => nitro.hooks.callHook('close'))
+  if (nuxt.options.debug) {
+    // @ts-expect-error remove in next version of hookable
+    const { close } = createDebugger(nitro.hooks, {
+      tag: 'nitro build'
+    })
+    nitro.hooks.hook('close', close)
+  }
 
   // Setup handlers
   const devMiddlewareHandler = dynamicEventHandler()
diff --git a/packages/nuxt/src/core/nuxt.ts b/packages/nuxt/src/core/nuxt.ts
index 157c0aec309..7975e48cd63 100644
--- a/packages/nuxt/src/core/nuxt.ts
+++ b/packages/nuxt/src/core/nuxt.ts
@@ -1,5 +1,5 @@
 import { join, normalize, resolve } from 'pathe'
-import { createHooks } from 'hookable'
+import { createHooks, createDebugger } from 'hookable'
 import type { Nuxt, NuxtOptions, NuxtConfig, ModuleContainer, NuxtHooks } from '@nuxt/schema'
 import { loadNuxtConfig, LoadNuxtOptions, nuxtCtx, installModule, addComponent, addVitePlugin, addWebpackPlugin, tryResolveModule, addPlugin } from '@nuxt/kit'
 // Temporary until finding better placement
@@ -183,7 +183,7 @@ async function initNuxt (nuxt: Nuxt) {
     addPlugin(resolve(nuxt.options.appDir, 'plugins/preload.server'))
   }
 
-  // Track components used to render for webpack
+  // Add nuxt app debugger
   if (nuxt.options.debug) {
     addPlugin(resolve(nuxt.options.appDir, 'plugins/debug'))
   }
@@ -234,6 +234,14 @@ export async function loadNuxt (opts: LoadNuxtOptions): Promise<Nuxt> {
 
   const nuxt = createNuxt(options)
 
+  // TODO: parallel kit:compatibility calls in defineModule
+  // if (nuxt.options.debug) {
+  //   // @ts-expect-error remove in next version of hookable
+  //   createDebugger(nuxt.hooks, {
+  //     tag: 'nuxt build'
+  //   })
+  // }
+
   if (opts.ready !== false) {
     await nuxt.ready()
   }
diff --git a/packages/nuxt/src/core/runtime/nitro/plugins/debug.ts b/packages/nuxt/src/core/runtime/nitro/plugins/debug.ts
index a0135cb9c14..41f909d2092 100644
--- a/packages/nuxt/src/core/runtime/nitro/plugins/debug.ts
+++ b/packages/nuxt/src/core/runtime/nitro/plugins/debug.ts
@@ -1,13 +1,8 @@
+import { createDebugger } from 'hookable'
 import type { NitroAppPlugin } from 'nitropack'
 
-const wrapName = (event: string) => `[nitro] ${event}`
-
 export default <NitroAppPlugin> function (nitro) {
-  nitro.hooks.beforeEach(({ name }) => {
-    console.time(wrapName(name))
-  })
-
-  nitro.hooks.afterEach(({ name }) => {
-    console.timeEnd(wrapName(name))
+  createDebugger(nitro.hooks, {
+    tag: 'nitro app'
   })
 }