Skip to content

Conversation

@ThimoDEV
Copy link
Contributor

@ThimoDEV ThimoDEV commented Mar 25, 2024

This PR adds a new launch.json so a maintainer of TresJS can use breakpoints during development.

How to use?

  • First setup the project as normal if you didn't have that already
  • Run pnpm playground
  • Press F5 or the play button in your Run and debug window
  • Set breakpoints in the TresJS core code or in your playground to test in that way

I had this weird issue where the localhost url wasn't working. I set the port on all to 3000 which seems to make the dev server more stable. I don't know if this impacts releases in any way?

@netlify
Copy link

netlify bot commented Mar 25, 2024

Deploy Preview for tresjs-docs ready!

Name Link
🔨 Latest commit 034522e
🔍 Latest deploy log https://app.netlify.com/sites/tresjs-docs/deploys/6601ac1b2caf60000827ad31
😎 Deploy Preview https://deploy-preview-599--tresjs-docs.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

: useElementSize(computed(() => toValue(canvas).parentElement))
: useElementSize(
computed(
() => toValue(canvas).parentElement,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @ThimoDEV why is this change needed?

Copy link
Contributor Author

@ThimoDEV ThimoDEV Mar 25, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @alvarosabu There is an issue when the TresCanvas uses the parent element width and height.

The usElementSize composable from VueUse loses its reactivity I assume which causes the TresCanvas width and height to be 0.

This issue occurs when you hit a breakpoint and continue debugging after. When you use the useWindowSize prop this doesn't happen.

This fixes that

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ThimoDEV would be possible to have this change in a separate PR, is a little bit confusing to understand the scope of this one.

@alvarosabu alvarosabu added investigation needs-test p2-nice-to-have Not breaking anything but nice to have (priority) labels Mar 31, 2024
@ThimoDEV
Copy link
Contributor Author

@alvarosabu Is there anything more you need/changed for this to be merged? So I can help get you there :)

: useElementSize(computed(() => toValue(canvas).parentElement))
: useElementSize(
computed(
() => toValue(canvas).parentElement,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ThimoDEV would be possible to have this change in a separate PR, is a little bit confusing to understand the scope of this one.

@ThimoDEV
Copy link
Contributor Author

ThimoDEV commented Mar 1, 2025

Hi @alvarosabu , The change was needed because of HMR. When you go into a breakpoint and want to continue you expect the canvas to render what was last there. However without this change it would freeze and you would have to restart the debugger completely

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

investigation needs-test p2-nice-to-have Not breaking anything but nice to have (priority)

Projects

Status: No status

Development

Successfully merging this pull request may close these issues.

2 participants