2.1.5 breaks manual trigger of click event

[vanboom]

With 2.1.4 we could do this on the toggle selector element:

  $(document).ready(function(){
    $("#async-trigger").trigger('click');
  });

With 2.1.5 this does not work. Running the ...trigger('click') in the console works, but the timing of this during the page load sequence is no longer working in 2.1.5.

I have not determined why yet, and will comment if I can determine what is happening in more detail.

[vanboom]

This works...

  $(window).bind('load', function(){
    $("#async-trigger").trigger('click');
  });

See _request.jquery.js.erb;116
_setUpToggle is now being delayed until after document loaded which I guess happens after the $(document).ready() phase?

[nikolalsvk]

Hey, @vanboom! Thanks for submitting an issue about this. I'm sorry your functionality got broken with the new 2.1.5 version.

This behavior was intended to happen, I'll update the release info after this. 2.1.5 version brought a change where toggle event listeners would add after the page has loaded. This fixed a bug where event handlers would try to attach to elements that were not yet loaded.

Hope this explained a bit more why this happened.

As for the solution to your problem, I suggest the following. Since you're using jQuery, turn on jQuery logic for render_async. You mentioned that this part of the code was working before

  $(document).ready(function() {
    $("#async-trigger").trigger('click');
  });

And it should work with jQuery turned on.

# This will render jQuery code, and skip Vanilla JS code
RenderAsync.configuration.jquery = true

Can you try this out and let me know how it goes? 🙏

[vanboom]

Unfortunately I am already using jQuery - in my case my call to trigger('click') is happening before the call to _setupToggle();

I suspect that this is due to the placement of my content_for :render_async block which is near the end of the html body. For some reason, I am not able to reproduce the issue as described in #90, perhaps that is caused by a similar placement issue of the content_for and the view-rendered javascript.

[nikolalsvk]

Right, can you post some code on how you call trigger('click') in your code? Have you tried wrapping it inside

$(document).ready(function() {
  $("#id-of-your-button").trigger('click');
});

Also, are you using Turbolinks by any chance?

[nikolalsvk]

If this still doesn't work due to the position of the triggering JS code and the render_async JS code, we'd have to add a new event. The new event would trigger when all the event listeners are attached in the _setupToggle() function.

Please check the previous comment, and respond if it's working for you so we can figure out the next steps :)

[nikolalsvk]

Can you try this out in the new 2.1.6 version. Maybe it will work with what you originally posted here #108 (comment)

If it's still a problem, we can reopen this issue and deal with it.

[vanboom]

Ok, thanks, sorry in a crunch and have not been able to do more testing yet. Thanks again.

[vanboom]

@nikolalsvk, EDIT - 2.1.6 still exhibits this issue, sorry. The render_async javascript is being delayed beyond where I am attempting to trigger the polling. My view code looks like this...

  = render_async job_path(@job_id), interval: 1250, toggle:{selector: '#render_async_control', event: 'toggle_polling'}

:javascript
  $(document).ready(function(){
    $("#render_async_control").trigger("toggle_polling");
  });

Unfortunately I am not able to reproduce or understand the bug described in #90 that prompted this change. I suspect that the bug reported in #90 was caused by the content_for(:render_async) block being placed before the view code in the layout.

This work around works to effectively delay the click trigger...

$(window).bind('load', function() {
  $("#id-of-your-button").trigger('click');
});

CAUTION: $(window).bind('load'...) event is not called if the view is rendered in a modal or popup so this solution will not work everywhere.

[nikolalsvk]

Hey, @vanboom, I'm wondering, is it necessary to trigger render_async using JavaScript in your project?

You could just start polling immediately, without having to toggle polling. Is this an option for you?

[vanboom]

@nikolalsvk, good idea, however as I understand, to allow the user to start/stop polling the toggle feature has to be used, which will not start polling immediately by default?

[nikolalsvk]

@vanboom exactly, I was thinking of adding an option to start polling immediately with the toggle feature. For example, render_async will start polling on the page load, but the user can still turn polling on/off after that if he wants. Would this be something you are interested in?

[vanboom]

Yes, that would be great. In a lot of my use cases, I want to start polling immediately but allow the user to toggle the polling on/off, or disable the polling based on a result like "job complete", similar to #106.

…

________________________________ From: Nikola Đuza <notifications@github.com> Sent: Wednesday, May 20, 2020 4:31 PM To: renderedtext/render_async <render_async@noreply.github.com> Cc: Don <dvboom@hotmail.com>; Mention <mention@noreply.github.com> Subject: Re: [renderedtext/render_async] 2.1.5 breaks manual trigger of click event (#108) @vanboom<https://github.com/vanboom> exactly, I was thinking of adding an option to start polling immediately with the toggle feature. For example, render_async will start polling on the page load, but the user can still turn polling on/off after that if he wants. Would this be something you are interested in? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub<#108 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AAB5OOVMLZXCKR73UU6W4PLRSRD3TANCNFSM4LX2APUA>.

[nikolalsvk]

Awesome, @vanboom, can you please create another issue as a feature request that will start polling on load? 🙇