How to debug why an island is working locally but not working when deployed?
I have an Island containing a select that changes the URL when a new item is selected. It is also disabled afterwards, since the "selected page" might need a bit time to load.
When testing it locally everything works fine, but when pushing and it is deployed to deno deploy the select does nothing. The devtools also say that no event listener has been attached. The code that is being fetched looks correct. I added two console.log to see whether they are called on the client: first line in the Island and first line in the event handler.
None of them reports to the browser console, so they are not executed on the client.
I disabled all adblockers.
How can I debug / understand what is going on?
6 Replies
I now decided to reintroduce the
disabled=!IS_BROWSER || props.disabled and the select never becomes enabled in the browser when using deno deploy. But when testing it on localhost everything works as expected.even when running
deno run -A main.ts locally instead of the start task, (what I am assuming is what deno deploy does), the island seems to work. And I looked at the downloaded code again, and there is nothing suspucios, beside the fact that the hydration doesn't seem to work.
Here is the code of my island: https://gist.github.com/karfau/eddad286fe07fe3a7bfc48b21e665a90Gist
An example island for the fresh webframework
An example island for the fresh webframework. GitHub Gist: instantly share code, notes, and snippets.
do you see the browser downloading the js chunks?
Yes
and there's no error in the console?
Nada
I will try to create a really simple reproduction with just the island, but not sure how fast I will be able to do it.
For now I switched to components, but it would have been a much better UI/UX to use the select.