Fix: inner <textarea> interpolation

tomlarkworthy commented 3 years ago

html<textarea>${'yo'}</textarea> was evaluating to <textarea></textarea> as the treeWalker method for removeing strings wrapped in COMMENTS will not traverse into psuedo children textarea has

Also npm script test using Jest + JSDom

Fixes https://github.com/observablehq/htl/issues/18

tomlarkworthy commented 3 years ago

Maybe should bump to version 0.3 too?

mbostock commented 3 years ago

Are there other weird elements like this?

tomlarkworthy commented 3 years ago

YES it's an 'escapable raw text element' like.... , and come to think of it, this bug bit me on title as well. Ok I can improve this now. Seems to only be title too</p> <p><a href="https://www.w3.org/TR/html52/syntax.html#escapable-raw-text">https://www.w3.org/TR/html52/syntax.html#escapable-raw-text</a></p> <p>Perhaps <Script> and <style> too (they are raw text elements)</p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/tomlarkworthy"><img src="https://avatars.githubusercontent.com/u/1848162?v=4" />tomlarkworthy</a> commented <strong> 3 years ago</strong> </div> <div class="markdown-body"> <p>ok I generalised it. Indeed a few other elements were suffering too (as captured in test cases) PTAL.</p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/mbostock"><img src="https://avatars.githubusercontent.com/u/230541?v=4" />mbostock</a> commented <strong> 3 years ago</strong> </div> <div class="markdown-body"> <p>I’ve added a simple testing framework (and eslint) and enabled CI for this repo. I incorporated the tests here in 3d2a783ac7033a16961689759daf156b6fbb694b and added a few others. Thanks!</p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/mbostock"><img src="https://avatars.githubusercontent.com/u/230541?v=4" />mbostock</a> commented <strong> 3 years ago</strong> </div> <div class="markdown-body"> <p>Took at crack at this in #22. Mind reviewing, @tomlarkworthy?</p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/tomlarkworthy"><img src="https://avatars.githubusercontent.com/u/1848162?v=4" />tomlarkworthy</a> commented <strong> 3 years ago</strong> </div> <div class="markdown-body"> <p>haha, I thought when you have gone through the trouble of redoing the test harness you couldn't possible stop at that point. Awesome.</p> </div> </div> <div class="page-bar-simple"> </div> <div class="footer"> <ul class="body"> <li>© <script> document.write(new Date().getFullYear()) </script> Githubissues.</li> <li>Githubissues is a development platform for aggregating issues.</li> </ul> </div> <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script> <script src="/githubissues/assets/js.js"></script> <script src="/githubissues/assets/markdown.js"></script> <script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.4.0/build/highlight.min.js"></script> <script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.4.0/build/languages/go.min.js"></script> <script> hljs.highlightAll(); </script> </body> </html>

observablehq / htl

Fix: inner <textarea> interpolation #21