Skip to content

Add rule to prohibit building script tags in the client #223

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Mar 25, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,7 @@ The available configs are:
- [No Blur](./docs/rules/no-blur.md)
- [No D None](./docs/rules/no-d-none.md)
- [No Dataset](./docs/rules/no-dataset.md)
- [No Dynamic Script Tag](./docs/rules/no-dynamic-script-tag.md)
- [No Implicit Buggy Globals](./docs/rules/no-implicit-buggy-globals.md)
- [No Inner HTML](./docs/rules/no-inner-html.md)
- [No InnerText](./docs/rules/no-innerText.md)
Expand Down
24 changes: 24 additions & 0 deletions docs/rules/no-dynamic-script-tag.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
# No Dynamic Script Tag

## Rule Details

Creating dynamic script tags bypasses a lot of security measures - like SRIs - and pose a potential threat to your application.
Instead of creating a `script` tag in the client, provide all necessary `script` tags in the page's HTML.

👎 Examples of **incorrect** code for this rule:

```js
document.createElement('script')
document.getElementById('some-id').type = 'text/javascript'
```

👍 Examples of **correct** code for this rule:

```html
<!-- index.html -->
<script src="/index.js" type="text/javascript">
```

## Version

4.3.2
1 change: 1 addition & 0 deletions lib/configs/recommended.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ module.exports = {
'github/array-foreach': 'error',
'github/no-implicit-buggy-globals': 'error',
'github/no-then': 'error',
'github/no-dynamic-script-tag': 'error',
'i18n-text/no-en': ['error'],
'import/default': 'error',
'import/export': 'error',
Expand Down
1 change: 1 addition & 0 deletions lib/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ module.exports = {
'no-implicit-buggy-globals': require('./rules/no-implicit-buggy-globals'),
'no-inner-html': require('./rules/no-inner-html'),
'no-innerText': require('./rules/no-innerText'),
'no-dynamic-script-tag': require('./rules/no-dynamic-script-tag'),
'no-then': require('./rules/no-then'),
'no-useless-passive': require('./rules/no-useless-passive'),
'prefer-observers': require('./rules/prefer-observers'),
Expand Down
29 changes: 29 additions & 0 deletions lib/rules/no-dynamic-script-tag.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
module.exports = {
meta: {
type: 'suggestion',
docs: {
description: 'disallow creating dynamic script tags',
url: require('../url')(module)
},
schema: []
},

create(context) {
return {
'CallExpression[callee.property.name="createElement"][arguments.length > 0]': function (node) {
if (node.arguments[0].value !== 'script') return

context.report({
node: node.arguments[0],
message: "Don't create dynamic script tags, add them in the server template instead."
})
},
'AssignmentExpression[left.property.name="type"][right.value="text/javascript"]': function (node) {
context.report({
node: node.right,
message: "Don't create dynamic script tags, add them in the server template instead."
})
}
}
}
}
38 changes: 38 additions & 0 deletions tests/no-dynamic-script-tag.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
const rule = require('../lib/rules/no-dynamic-script-tag')
const RuleTester = require('eslint').RuleTester

const ruleTester = new RuleTester()

ruleTester.run('no-dynamic-script-tag', rule, {
valid: [
{
code: 'document.createElement("div")'
},
{
code: 'document.createElement("span")'
},
{
code: 'document.createElement("span").type = "foo"'
}
],
invalid: [
{
code: 'document.createElement("script")',
errors: [
{
message: "Don't create dynamic script tags, add them in the server template instead.",
type: 'Literal'
}
]
},
{
code: 'document.createElement("span").type = "text/javascript"',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should be a script right? Spans don't have a type.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I just wanted to test that .type = "text/javascript" will fail. If I add document.createElement("script"), it will fail without checking the type

errors: [
{
message: "Don't create dynamic script tags, add them in the server template instead.",
type: 'Literal'
}
]
}
]
})