Twig: Parse error with data-prettydiff-ignore

[rubas]

Source

{% block content %}
        <script data-prettydiff-ignore>
              (function () {  
                var d = document, s = d.createElement('script');
              })();
        </script>
  {% endblock %}

Problem

vendor/bin/prettydiff.sh test.twig

test/node_modules/prettydiff/js/prettydiff.js:10983
                        : tagName(data.token[data.begin[parse.count]].toLowerCase())
                                                                      ^

TypeError: Cannot read property 'toLowerCase' of undefined
    at lexer_markup_content (test/node_modules/prettydiff/js/prettydiff.js:10983:71)
    at Object.lexer_markup [as markup] (test/node_modules/prettydiff/js/prettydiff.js:11353:17)
    at Object.parse_parser [as parser] (test/node_modules/prettydiff/js/prettydiff.js:57:50)
    at mode (test/node_modules/prettydiff/js/prettydiff.js:2043:49)
    at node_apps_readMethod_resolve_stat_resolveItem_fileCallback_diffrc (test/node_modules/prettydiff/js/services.js:3673:64)
    at node_apps_readMethod_prettydiffrc (test/node_modules/prettydiff/js/services.js:3196:13)
    at Object.node_apps_readMethod_resolve_stat_resolveItem_fileCallback [as callback] (test/node_modules/prettydiff/js/services.js:3668:45)
    at node_apps_readFile_file_open_read_read

---

It works as expected after deleting the data-prettydiff-ignore attribute

This works

{% block content %}
        <script>
              (function () {  
                var d = document, s = d.createElement('script');
              })();
        </script>
  {% endblock %}

[rubas]

Other maybe related errors we see when we run it over all the twig code. Haven't yet figured out what is triggering those.

test/node_modules/prettydiff/js/prettydiff.js:13202
                  (data.token[a].length + data.token[a + 1].length > options.wrap)) &&
                                                            ^

TypeError: Cannot read property 'length' of undefined
  at beautify_markup_levels_content (test/node_modules/prettydiff/js/prettydiff.js:13202:63)
  at beautify_markup_levels (test/node_modules/prettydiff/js/prettydiff.js:13510:33)
  at Object.beautify_markup [as markup] (test/node_modules/prettydiff/js/prettydiff.js:13584:10)
  at mode (test/node_modules/prettydiff/js/prettydiff.js:2044:58)
  at node_apps_readMethod_resolve_stat_resolveItem_fileCallback_diffrc (test/node_modules/prettydiff/js/services.js:3673:64)
  at node_apps_readMethod_prettydiffrc (test/node_modules/prettydiff/js/services.js:3196:13)
  at Object.node_apps_readMethod_resolve_stat_resolveItem_fileCallback [as callback] (test/node_modules/prettydiff/js/services.js:3668:45)
  at node_apps_readFile_file_open_read_readFile_close (test/node_modules/prettydiff/js/services.js:3157:34)
  at FSReqCallback.oncomplete (fs.js:146:23)
test/node_modules/prettydiff/js/prettydiff.js:13202
                  (data.token[a].length + data.token[a + 1].length > options.wrap)) &&
                                                            ^

TypeError: Cannot read property 'length' of undefined
  at beautify_markup_levels_content (test/node_modules/prettydiff/js/prettydiff.js:13202:63)
  at beautify_markup_levels (test/node_modules/prettydiff/js/prettydiff.js:13510:33)
  at Object.beautify_markup [as markup] (test/node_modules/prettydiff/js/prettydiff.js:13584:10)
  at mode (test/node_modules/prettydiff/js/prettydiff.js:2044:58)
  at node_apps_readMethod_resolve_stat_resolveItem_fileCallback_diffrc (test/node_modules/prettydiff/js/services.js:3673:64)
  at node_apps_readMethod_prettydiffrc (test/node_modules/prettydiff/js/services.js:3196:13)
  at Object.node_apps_readMethod_resolve_stat_resolveItem_fileCallback [as callback] (test/node_modules/prettydiff/js/services.js:3668:45)
  at node_apps_readFile_file_open_read_readFile_close (test/node_modules/prettydiff/js/services.js:3157:34)
  at FSReqCallback.oncomplete (fs.js:146:23)
test/node_modules/prettydiff/js/prettydiff.js:13202
                  (data.token[a].length + data.token[a + 1].length > options.wrap)) &&
                                                            ^

TypeError: Cannot read property 'length' of undefined
  at beautify_markup_levels_content (test/node_modules/prettydiff/js/prettydiff.js:13202:63)
  at beautify_markup_levels (test/node_modules/prettydiff/js/prettydiff.js:13510:33)
  at Object.beautify_markup [as markup] (test/node_modules/prettydiff/js/prettydiff.js:13584:10)
  at mode (test/node_modules/prettydiff/js/prettydiff.js:2044:58)
  at node_apps_readMethod_resolve_stat_resolveItem_fileCallback_diffrc (test/node_modules/prettydiff/js/services.js:3673:64)
  at node_apps_readMethod_prettydiffrc (test/node_modules/prettydiff/js/services.js:3196:13)
  at Object.node_apps_readMethod_resolve_stat_resolveItem_fileCallback [as callback] (test/node_modules/prettydiff/js/services.js:3668:45)
  at node_apps_readFile_file_open_read_readFile_close (test/node_modules/prettydiff/js/services.js:3157:34)
  at FSReqCallback.oncomplete (fs.js:146:23)
test/node_modules/prettydiff/js/prettydiff.js:13202
                  (data.token[a].length + data.token[a + 1].length > options.wrap)) &&
                                                            ^

TypeError: Cannot read property 'length' of undefined
  at beautify_markup_levels_content (test/node_modules/prettydiff/js/prettydiff.js:13202:63)
  at beautify_markup_levels (test/node_modules/prettydiff/js/prettydiff.js:13510:33)
  at Object.beautify_markup [as markup] (test/node_modules/prettydiff/js/prettydiff.js:13584:10)
  at mode (test/node_modules/prettydiff/js/prettydiff.js:2044:58)
  at node_apps_readMethod_resolve_stat_resolveItem_fileCallback_diffrc (test/node_modules/prettydiff/js/services.js:3673:64)
  at node_apps_readMethod_prettydiffrc (test/node_modules/prettydiff/js/services.js:3196:13)
  at Object.node_apps_readMethod_resolve_stat_resolveItem_fileCallback [as callback] (test/node_modules/prettydiff/js/services.js:3668:45)
  at node_apps_readFile_file_open_read_readFile_close (test/node_modules/prettydiff/js/services.js:3157:34)
  at FSReqCallback.oncomplete (fs.js:146:23)

[panoply]

@rubas leverage the sparser ignore comments, eg:

{% block content %}
  <!-- parse-ignore-start -->
        <script>
              (function () {  
                var d = document, s = d.createElement('script');
              })();
        </script>
  <!-- parse-ignore-end -->
  {% endblock %}

[rubas]

Thanks. Helps but that is what data-prettydiff-ignore should have been for ..

[panoply]

There are some conflicts with PrettyDiff I've noticed since I've worked with it. We use the Liquid parser which is similar to the Twig parser. If you're defining the language as html but your content contains Twig syntax PrettyDiff will have trouble with <script> and <style> markup tags. Same goes for self closing tags. For example, if your document contents contains an image tag without a self closing forward slash, eg: <img src="/url"> PrettyDiff will complain about there being more start tags than end tags.

The way we combat this is to set language to html and before passing source contents to PrettyDiff, we wrap these tags/regions with sparser ignore comments. While this might not be the most pleasant solutions for now it seems like the only solution until such errors can be addressed.

Hope it helps.