Run code PrismJS button registration #14
Conversation
index.js
Outdated
| el = parents[i]; | ||
| break; | ||
| } | ||
| }; |
There was a problem hiding this comment.
Does registerButton only need to be called once (vs. a call for each instance of the toolbar)?
Instead of keeping the parents, should we walk up from env.element to find the pre?
There was a problem hiding this comment.
The registerButton needs to be called once otherwise it register all the buttons for each of the codes.
For parents I did try to walk up but it didn't work.
test.js
Outdated
| Array.from(codePens).forEach(function(codePen) { | ||
| codePen.click(); | ||
| var toolbars = doc.querySelectorAll('.toolbar'); | ||
| Array.from(toolbars).forEach(function(toolbar) { |
There was a problem hiding this comment.
Is Array.from necessary? I think toolbars.forEach would exist.
There was a problem hiding this comment.
No I just changed the existed code that used it, I'll update it
index.js
Outdated
| if (hasRunBtn) { | ||
| var btn = document.createElement("button"); | ||
| btn.innerHTML = "Run"; | ||
| btn.addEventListener('click', function() { |
There was a problem hiding this comment.
do we need to setup this event handler for every codepen? Could event delegation be used to help peformance?
There was a problem hiding this comment.
@justinbmeyer updated, thank you!
|
@cherifGsoul is this good to go? |
I think so, @chasenlehara do you want to take a look before merging it? |
index.js
Outdated
| while(el && el.parentNode) { | ||
| if(matches.call(el.parentNode, '.demo_wrapper')) { | ||
| var demoWrapper = el.parentNode; | ||
| return demoWrapper; |
There was a problem hiding this comment.
I think you can just return demoWrapper instead of assigning it to a variable.
index.js
Outdated
| if (hasRunBtn) { | ||
| var btn = document.createElement("button"); | ||
| btn.innerHTML = "Run"; | ||
| document.body.addEventListener('click', function (ev) { |
There was a problem hiding this comment.
This event listener only gets added once, right? It doesn’t get added for each button?
[I see the event delegation, which is nice, but I want to double check that the listener isn’t added multiple times. If it is, this logic should be moved outside the registerButton call.]
There was a problem hiding this comment.
@chasenlehara Fixed, thank you!
For canjs/bit-docs-html-canjs#561
This adds
Runbutton to run code in CodePen, the logic behind the changes:I upgraded Zombie in order to use modern browser functions.