MDL drawer toggle button dissappeared on turbolinks page change

[gruberjl]

My site has a navigation drawer that has a drawer toggle button in the top left. Code: https://getmdl.io/components/index.html#layout-section/layout

Every time I followed a link the button to toggle the drawer would disappear. MDL is adding the button using JS on page load. When turbolinks changed pages, MDL wasn't recognizing the page change and adding the button back in.

As a quick fix you can add the following code to your project JavaScript.

document.addEventListener('page:change', function() { componentHandler.upgradeDom(); });
document.addEventListener('turbolinks:load', function() { componentHandler.upgradeDom(); });

I forked the project and added the above lines of code to material.js. Using the forked changes, users won't have to add the code to their projects.

[rubysamurai]

Hello,
Thanks for the PR, but turbolinks compatibility fix probably shouldn't be hacked into actual MDL code, unless MDL team decides to natively support turbolinks.

Calling componentHandler.upgradeDom() from material.js file wouldn't solve the turbolinks issue for those, who chose modular JavaScript components load, for example. And for those projects without turbolinks extra calls are redundant.

But thanks for bringing attention to this subject, this is definetly a major use case for developers using this gem and I will add a note in README with basic code examples for turbolinks v2/5 fixes.

[gruberjl]

Great point. I shouldn't have thrown my quick hack in a pull request. I've never made a gem before so I'm not sure how you would perform an "if using turbolinks then do..."

[smd686s]

It would be good to add your change to the docs.

On Jul 29, 2016 9:46 PM, "John" notifications@github.com wrote:

Great point. I shouldn't have thrown my quick hack in a pull request. I've
never made a gem before so I'm not sure how you would perform an "if using
turbolinks then do..."

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
#10 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAQtkm4s1IlFhqfYWPchnZhWRuVrmLLMks5qarr2gaJpZM4JYayz
.

[rubysamurai]

Now Ruby on Rails section of README includes a note on turbolinks compatibility with quick fixes examples.

Let me know, please, if it should be reworded better or anything is missing.