Console errors with setting data-turbo-stream=true to a link

[abhinavmsra]

Description

• I needed a link to trigger a turbo stream request i.e.

Accept: 'text/vnd.turbo-stream.html, text/html, application/xhtml+xml'

• To that end, i added data-turbo-stream=true to a link.

  <a data-turbo-stream="true" data-turbo-frame="_top" href="http://localhost:3000/inbox">Inbox</a>

  This triggers a turbo stream request, all good till now.

ISSUE

Every click on such links constantly trigger JS errors.

turbo.es2017-esm.js:1055 [Violation] 'click' handler took 1787ms
turbo.es2017-esm.js:1669 Uncaught (in promise) undefined
cancel @ turbo.es2017-esm.js:1669
stop @ turbo.es2017-esm.js:2242
startVisit @ turbo.es2017-esm.js:2226
visitProposedToLocation @ turbo.es2017-esm.js:1952
visitProposedToLocation @ turbo.es2017-esm.js:2890
proposeVisit @ turbo.es2017-esm.js:2213
visit @ turbo.es2017-esm.js:2828
followedLinkToLocation @ turbo.es2017-esm.js:2883
LinkClickObserver.clickBubbled @ turbo.es2017-esm.js:1063

Wonder if links are not supposed to use data-turbo-stream="true" or its a different issue?

I am using

"@hotwired/turbo-rails": "^7.2.0-beta.2",

[marcoroth]

Hey @abhinavmsra, thanks for opening this issue!

It seems like that this is a Chrome thing, where Chrome tries to "warn" you about if a blocking event-handler is taking a long time to complete, which is usually not what you want.

But in this case, this is how Turbo works. It will fetch the new (stream) content in the background and waits for that response to come back in order to process it.

I'm wondering if we can improve this event-handling in Turbo so it's not actually blocking/waiting in the event handler for the response but deferring the processing of the response in a different part of the code.

At any rate, I think this is just an "ugly" error in the console, but shouldn't cause any harm or restrict any functionality.

[kevinmcconnell]

@abhinavmsra this does look like a bug, yes. You should be able to use data-turbo-stream on links without error.

@seanpdoyle it looks like we're seeing this error in a few situations now, but not always with streams. From a quick look I think we started seeing it after #650. An example not involving streams that triggers this error is if you click the back button before a visit has completed. Does this ring any bells for you?

[bilogic]

I added data-turbo-stream=true to my <a href=..., but I don't get text/vnd.turbo-stream.html in my XHR requests to the server, any idea why?

UPDATE: I switched to "^7.2.0-beta.2" and now it works.