Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug]: Console Ninja not showing the loging for JS/TS inside of .astro components (Pro) #373

Open
tarasis opened this issue Feb 3, 2025 · 3 comments
Labels

Comments

@tarasis
Copy link

tarasis commented Feb 3, 2025

What happened?

I was expecting that the inline logging, or logging to the CN view what capture the values / logs I was outputing with console.log in .astro files to work, but instead nothing was captured.

However when I did some logging in a plain JS file it was captured as expected.

First is how it appears in .astro file
Image

Second in the JS file
Image

Node ver 23.7.0
npm ver 10.9.2
Astro ver 5.2.3

Version

1.0.386 (PRO)

CLI command to start your dev tool

npm run dev

Steps to reproduce (or sample repo)

  1. Create a .astro file
  2. add a simple script tag
const date = new Date()
console.log("Hello"
  1. Set breakpoints on both, note the little blue indicator doesn't appear
  2. Use the component, note nothing is logged to CN

Repeat with the same in a normal JS file (I used rss.xml.js for each)
Again set breakpoints on the code and this time

Log output

06:06:53.317 info host ------------ starting ------------
06:06:53.337 info extension host process output: port:[50455]
06:06:53.337 info extension
06:06:53.341 info host client connected: extension { address: '127.0.0.1', family: 'IPv4', port: 50455 }
06:06:53.351 info host starting host: {"extensionFolder":"/Users/tarasis/.vscode/extensions/wallabyjs.console-ninja-1.0.386","runtimeHookFile":"/Users/tarasis/.vscode/extensions/wallabyjs.console-ninja-1.0.386/out/runtimeHook/tracer.js","globalErrorHandlerFile":"/Users/tarasis/.vscode/extensions/wallabyjs.console-ninja-1.0.386/out/runtimeHook/errorHandler.js","networkLoggingHandlerFile":"/Users/tarasis/.vscode/extensions/wallabyjs.console-ninja-1.0.386/out/runtimeHook/networkLoggingHandler.js","filesToInstrument":[{"path":"/users/tarasis/programming/websites/tarasis.net/src/pages/blog/index.astro","autoLogPoints":[{"range":{"startLine":97,"endLine":97,"startColumn":0,"endColumn":0}},{"range":{"startLine":100,"endLine":100,"startColumn":0,"endColumn":0}}],"reason":"autoLogPoints"},{"path":"/users/tarasis/programming/websites/tarasis.net/src/components/altthemeselector.astro","autoLogPoints":[{"range":{"startLine":48,"endLine":48,"startColumn":0,"endColumn":0}},{"range":{"startLine":50,"endLine":50,"startColumn":0,"endColumn":0}}],"reason":"autoLogPoints"},{"path":"/users/tarasis/programming/websites/tarasis.net/src/pages/rss.xml.js","autoLogPoints":[{"range":{"startLine":6,"endLine":6,"startColumn":0,"endColumn":0}}],"reason":"autoLogPoints"}],"debug":false,"config":{"dateTimeFormat":"HH:mm:ss.SSS","dateTimeDisplayMode":"Absolute","installBinToPath":true,"openLinksInEditor":true,"maxLogViewerEntries":15000,"showWelcomeMessageInTools":true,"fontSize":10,"autoClearLogViewerOnFileChanges":true,"outputMode":"In View","captureFunctions":false,"searchUrl":"https://www.google.com/search?q={query}","enableProFeatures":true,"toolsToAutoPatch":["vite","angular","jest","webpack","next.js","nest.js","cypress","http-server","serve","live-server","nuxt","remix","qwik","hydrogen","serverless","astro","live-server-extension","live-preview-extension"],"showErrors":true,"showLogsOnlyFromOpenedFiles":false,"showLogsFromLogPointsOnly":false,"showLogsFromMultipleRunningToolsTogether":false,"predictiveLoggingEnabled":true,"allowConsoleLogToTriggerPredictions":true,"showNetworkRequests":true},"allowedHosts":["localhost","127.0.0.1","example.cypress.io","Zifnab.local","192.168.0.101"],"host":"127.0.0.1","forcedStart":true,"startTime":1738562813121}
06:06:53.374 info host starting tools discovery and integration
06:06:53.377 info host looking for tools to patch
06:06:53.444 info host worker Starting Host Worker...
06:06:53.454 info host found 6 tool file(s) to patch
06:06:53.455 info host patching /Users/tarasis/.vscode/extensions/ritwickdey.liveserver-5.7.9/node_modules/live-server/index.js
06:06:53.456 info host patching /Users/tarasis/.vscode/extensions/ms-vscode.live-server-0.4.15/out/extension.js
06:06:53.456 info host patching /users/tarasis/programming/websites/tarasis.net/node_modules/vite/bin/vite.js
06:06:53.456 info host patching /users/tarasis/programming/websites/tarasis.net/node_modules/astro/astro.js
06:06:53.511 info host Host's startup and patch time: 390 ms
06:06:53.511 info host completed tools discovery and integration
06:06:53.648 info host client connected: runtimeHook { address: '127.0.0.1', family: 'IPv4', port: 50455 }
06:06:54.365 info buildHook-9348 allowed tools: vite, angular, jest, webpack, next.js, nest.js, cypress, http-server, serve, live-server, nuxt, remix, qwik, hydrogen, serverless, astro, live-server-extension, live-preview-extension, node
06:06:54.365 info buildHook-9348 running tools: astro
06:06:54.367 info host client connected: buildHook { address: '127.0.0.1', family: 'IPv4', port: 50455 }
06:06:54.380 info buildHook-9348 file processed (stat): 0 log points, error handler: true, network logging handler: true
06:06:54.387 info buildHook-9348 file processed (stat): 0 log points, error handler: false, network logging handler: false
06:06:54.390 info buildHook-9348 file processed (stat): 8 log points, error handler: false, network logging handler: false
06:06:54.390 info buildHook-9348 allowed tools: vite, angular, jest, webpack, next.js, nest.js, cypress, http-server, serve, live-server, nuxt, remix, qwik, hydrogen, serverless, astro, live-server-extension, live-preview-extension, node
06:06:54.390 info buildHook-9348 running tools: astro
06:07:20.003 info buildHook-9348 file processed (stat): 0 log points, error handler: true, network logging handler: true
06:07:53.346 info host removing cache folder: fa4e04642b082df6baf412c58758e84a
06:08:10.653 info buildHook-9348 file processed (promise): 0 log points, error handler: false, network logging handler: false
06:08:21.347 info buildHook-9348 file processed (promise): 0 log points, error handler: false, network logging handler: false
06:09:22.725 info buildHook-9348 file processed (stat): 8 log points, error handler: false, network logging handler: false
06:09:52.474 info buildHook-9348 file processed (stat): 8 log points, error handler: false, network logging handler: false
06:15:52.268 info buildHook-9348 file processed (stat): 8 log points, error handler: false, network logging handler: false
06:15:52.896 info buildHook-9348 file processed (stat): 8 log points, error handler: false, network logging handler: false
06:15:56.917 info buildHook-9348 file processed (stat): 8 log points, error handler: false, network logging handler: false
06:16:27.879 info buildHook-9348 file processed (stat): 8 log points, error handler: false, network logging handler: false
06:16:31.231 info buildHook-9348 file processed (stat): 8 log points, error handler: false, network logging handler: false
06:16:40.067 info buildHook-9348 file processed (promise): 10 log points, error handler: false, network logging handler: false
(END)
@ArtemGovorov
Copy link
Member

Hello,

Unfortunately we can't reproduce the issue.

We have tried

  • generating Blog template with npm create astro@latest (5.2.3);
  • adding a script tag to the src/components/BaseHead.astro file;
  • adding a logpoint on a line of the script, and also logging the same value with console.log

It's working as expected for us:

Image

Can you please verify that console.log from your Astro file is showing up in your browser Dev Tools console?

If it's now showing up in the browser either, then the code in the script tag is not being executed and that may explain the lack of logged values.

If it's showing up in the browser but not in your editor via CN, please share a sample repo where we can reproduce the issue.

@tarasis
Copy link
Author

tarasis commented Feb 3, 2025

For that one file it is going to the Browsers console and not CN, I know the code is executing as its a theme switcher

Image

I have now checked others and then do some to work (either JS in {} inside html), or in a newly added script tag.

When home I'll upload the latest version of the code and point you to the repo (its not private and there is no secret info in it).

@smcenlly
Copy link
Member

@tarasis - would you be able to share your repo so we can continue our investigation of the problem that you experienced?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants