Created these notes while attempting to pass CSP checking for general xss issues.

• Make your app return the csp headers. To do this i used express-csp as we are using express. We use the following policy.

  Content-Security-Policy:
  default-src 'self';
  img-src 'self' https://externalsite1.com http://externalsite1.com;
  object-src 'none';
  script-src 'strict-dynamic' 'nonce-04111658';
  style-src * data: http://* 'unsafe-inline'

  Notes: Everything should be secure with the following exceptions.

  img-src - We need to add some paths for random image generator sites we use in the examples on blockgrid, hierarchy, and image components. You may need to include your own trusted sites.

  style-src We need to allow the soho script to set inline styles. We set this to http://* for the various sites we use. If we don't do this many components cannot function until we can refactor them to use CSSDOM instead of style tags (search style= in all *.js files). Some of the components needing work are mentioned on Issue 628

• Replace all style="display: none;" with class hidden and use CSSDOM or classes for all styles you use

• Can testing with CSP mitigator Then note that we can test pages like http://localhost:4000/components/personalize/example-index using:

  script-src 'self';
  style-src 'self';
  frame-ancestors 'self';
  object-src 'none'

Escaping Info

Something like elem.html(markup); will trigger this warning. To address we should use whitelisting for example:

DOM.html(elem, markup, '<span><div>');'

If this cannot be limited to a few types then sanitizing can be used.

DOM.html(elem, markup, '*');'

Even better if all tags can be stripped.

xssUtils.stripTags(string);

Or a pure alphanumeric value.

xssUtils.ensureAlphaNumeric(string);

Something like window.location = href will generate this error. To address we should use code to ensure the URL is relative.

Soho.xss.isUrlLocal(url)

Something like console.log will generate this error. For client side code this is a false positive. But can generate a lot of scan error. To address we should use toast instead to show example output.

$('body').toast({
  'title': '<some> Event Triggered',
  'message': 'The value was changed to : ' + value + ' .. ect'
});

Something like this.listUl.find(li[data-val="${value.replace(/"/g, '/quot/')}"]); will generate this error. If the value is not external this is a false positive if using newer than jQuery 1.9. But to be safe we can use:

xssUtils.stripTags(string);

xssUtils.sanitizeHTML(string);

Or a pure alphanumeric value.

xssUtils.ensureAlphaNumeric(string);