csp-html-linter
v1.0.13
Published
Lint your HTML for Content Security Policy Violations.
Downloads
18
Maintainers
Readme
csp-html-linter
A tool designed to analyze HTML and identify potential breaches of Content Security Policy (CSP) rules. The goal is to prevent CSP violations from infiltrating your codebase during the build process.
By default it throws errors if it finds any usage of:
- inline Styles
<div style="color:blue;"></div>
- inline javascript similar to:
javascript:void(0)
onclick="doSomething()"
- Style tags without a nonce attribute
<style></style>
- Script tags without a nonce attribute
<script></script>
Install
Using npm:
npm install csp-html-linter --save-dev
Package.json Usage
Import the plugin and call csp-html-linter passing it an include argument containing a glob to tell it where to find the html files. You can also pass any of the other options.
{
"scripts" : {
"lint" : "csp-html-linter --include \"src/**/*.html\" --allowInlineStyles --verbose"
},
}
CLI Basic Usage
Import the plugin and call parse() passing the code
const cspHtmlLinter = require('csp-html-linter');
const violations = cspHtmlLinter.parse(code);
Returns an array of violation messages in the form :['violation message 1', 'violations message 2']
CLI Advanced Usage
Import the plugin and call parse() passing the code and the options.
By default all options are defaulted to false.
const cspHtmlLinter = require('csp-html-linter');
const options = {
allowInlineStyles: true,
allowInlineJs: true,
allowStyleTagWithoutNonce: true,
allowScriptTagWithoutNonce: true,
includeLocationInfo: true
};
const violations = cspHtmlLinter.parse(code, options);
if includeLocationInfo is set, returns an object in the form :
{
message:'',
location: {
startLine,
startCol,
startOffset,
endLine,
endCol,
endOffset
}
}
The configuration above will allow the following:
<style>
.color{
color:red;
}
</style>
<script></script>
<div onclick="doSomething()"></div>
<div style="color:black;"></div>
<a href="javascript:void(0)">click here</a>
Options
allowInlineStyles
Type: Boolean : Optional
Indicates if inline styles should be allowed. Defaults to false.
allowInlineJs
Type: Boolean : Optional
Indicates if inline JavaScript should be allowed. Defaults to false.
allowStyleTagWithoutNonce
Type: Boolean : Optional
Indicates if style tags should require a nonce. Defaults to false.
allowScriptTagWithoutNonce
Type: Boolean : Optional
Indicates if script tags should require a nonce. Defaults to false.
includeLocationInfo
Type Boolean : optional
Indicates if location info should be returned. When set, the returned object is no longer an array of messages but a format similar to the following:
{
message: 'You must not use the inline Javascript event: onclick',
location: {
startLine,
startCol,
startOffset,
endLine,
endCol,
endOffset,
}
}