@zohodesk/eslint-plugin-select2-restricted-options
v1.0.0
Published
An ESLint plugin that restricts the use of formatSelection and formatResult to prevent potential issues when passed into select2() as initialization options. This proactive measure helps avoid Cross-Site Scripting (XSS) vulnerabilities and other unintende
Downloads
88
Maintainers
Keywords
Readme
eslint-plugin-select2-restricted-options
An ESLint plugin that restricts the use of formatSelection and formatResult to prevent potential issues when passed into select2() as initialization options. This proactive measure helps avoid Cross-Site Scripting (XSS) vulnerabilities and other unintended side effects.
Overview
The formatSelection and formatResult options in select2() can introduce vulnerabilities when used improperly. This plugin enforces rules to prevent:
- Adding formatSelection and formatResult as properties to any object.
- Declaring variables named formatSelection or formatResult that could be used as values for select2() initialization.
- Assigning formatSelection and formatResult to objects via property assignment, such as obj.formatResult or obj['formatResult'].
Installation
Install the plugin using npm:
npm install --save-dev @zohodesk/eslint-plugin-select2-restricted-options
Usage
Add the plugin and rule to your ESLint configuration:
// .eslintrc.js
module.exports = {
plugins: ["@zohodesk/eslint-plugin-select2-restricted-options"],
rules: {
"@zohodesk/select2-restricted-options/select2-restricted-options": "error"
}
};
Rule Details
This rule disallows:
- Using formatSelection and formatResult as properties in any object.
- Declaring variables named formatSelection or formatResult that could be passed to select2() as initialization options.
- Assigning formatSelection or formatResult to objects after their creation.
Examples of incorrect code:
Passing as initialization options:
// Incorrect: Using formatSelection in the initialization object
$(".my-select").select2({
formatSelection: function (item) {
return item.text;
}
});
// Incorrect: Using formatResult in the initialization object
$(".my-select").select2({
formatResult: function (item) {
return "<div>" + item.text + "</div>";
}
});
// Incorrect: Using both formatSelection and formatResult
$(".my-select").select2({
formatSelection: function (item) { /* ... */ },
formatResult: function (item) { /* ... */ }
});
Using variables as options:
// Incorrect: Declaring variables named formatSelection and formatResult
var formatSelection = function (item) {
return item.text;
};
var formatResult = function (item) {
return "<div>" + item.text + "</div>";
};
// Incorrect: Passing the variables to select2()
$(".my-select").select2({
formatSelection: formatSelection,
formatResult: formatResult
});
Assigning properties after object creation:
// Incorrect: Adding properties via assignment
var options = {};
options.formatSelection = function (item) {
return item.text;
};
options['formatResult'] = function (item) {
return "<div>" + item.text + "</div>";
};
$(".my-select").select2(options);
Examples of correct code:
In the higher version 4.0.0
Using safe alternatives:
// Correct: Using templateSelection and templateResult
$(".my-select").select2({
templateSelection: function (item) {
return $("<span>").text(item.text);
},
templateResult: function (item) {
return $("<div>").text(item.text);
}
});
Avoiding restricted properties:
// Correct: Not using restricted properties or variable names
var selectionTemplate = function (item) {
return $("<span>").text(item.text);
};
var resultTemplate = function (item) {
return $("<div>").text(item.text);
};
var options = {
templateSelection: selectionTemplate,
templateResult: resultTemplate
};
$(".my-select").select2(options);
Additional Resources
Note: Since we maintain legacy code with older versions of select2, it is crucial to prevent the accidental use of vulnerable options. This plugin helps ensure that formatSelection and formatResult are not used, thereby mitigating potential security risks.
About the vulnerability
select2 3.5.1 has known vulnerabilities: severity: medium; summary: Improper Neutralization of Input During Web Page Generation in Select2, CVE: CVE-2016-10744, githubID: GHSA-rf66-hmqf-q3fc;
- https://github.com/advisories/GHSA-rf66-hmqf-q3fc
- https://nvd.nist.gov/vuln/detail/CVE-2016-10744
- https://github.com/select2/select2/issues/4587
- https://github.com/snipe/snipe-it/pull/6831
- https://github.com/snipe/snipe-it/pull/6831/commits/5848d9a10c7d62c73ff6a3858edfae96a429402a
- https://github.com/select2/select2