Migrate away from doT.js templating library over CSP security failure

[mappu]

Hi,

jquery-QueryBuilder (jqqb) is a great and featureful time-saving library. Thank you for all your work.

We'd like to implement CSP security policies on our web app, to reduce possibility of JS-based attacks (XSS, etc).

jqqb uses the doT.js library for templating HTML.

The doT.js library is incompatible with CSP security policies (see olado/doT#276 ) and I don't think it's fixable with their current design.

• How heavy is jqqb's use of doT?
• Is it possible to migrate to something that does not use eval or equivalent?
• Is it possible to "precompile" jqqb's use of doT so that eval is not needed at runtime?

Thank you,

[mistic100]

If change there is it won't be changed the next major version.

You can already replace the templates in your configuration with a function returning the HTML, using underscore.template for exemple.
https://querybuilder.js.org/#templates

[lol768]

+1 for this, it's a real shame this needs unsafe-eval out of the box.

[abeverley]

I've created drop-in replacement Handlebars templates, to enable JQQB to be used with a CSP policy without the aforementioned exceptions. Full details are here: https://github.com/abeverley/querybuilder-csp

@mistic100 - would you like me to create a PR containing any of this information or files?

Any comments welcome.

[lol768]

Although I don't remember doing this, it would appear that I just forked this library in the end to make it work: https://www.npmjs.com/package/@lol768/jquery-querybuilder-no-eval

lol768@fa8651a - just compiled the templates as-is, lol. Janky, but it does remove the need for unsafe-eval

Handlebars is a much nicer approach @abeverley and actually maintains the ability to modify the templates

[mistic100]

A native string template would also work just fine, without requiring another libary.

QueryBuilder.templates.rule = ({ rule_id, icons, translate, settings }) => `
<div id="${rule_id}" class="rule-container">
  <div class="rule-header">
    <div class="btn-group pull-right rule-actions">
      <button type="button" class="btn btn-xs btn-danger" data-delete="rule">
        <i class="${icons.remove_rule}"></i> ${translate("delete_rule")}
      </button>
    </div>
  </div>
  ${settings.display_errors ? `<div class="error-container"><i class="${icons.error}"></i></div>` : ''}
  <div class="rule-filter-container"></div>
  <div class="rule-operator-container"></div>
  <div class="rule-value-container"></div>
</div>
`;

---

That being said this repository is dead.

[abeverley]

That being said this repository is dead.

Thanks for letting us know. Just to clarify, does that mean that it has moved elsewhere or that you are no longer maintaining it?

[abeverley]

@mistic100 - just checking whether you'd like someone else to takeover this module if you are no longer maintaining it?

Thanks,

Andy