aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorMichał Gołębiowski-Owczarek <m.goleb@gmail.com>2022-07-14 20:52:02 +0200
committerGitHub <noreply@github.com>2022-07-14 20:52:02 +0200
commit8cc5bae1caa1fcf96bf5862c5646c787020ba3f9 (patch)
treecc2db46ecf233161eaeebae0a6f8ebf82da53075
parentb53e7beb6884a8de7710146112bc48aecd8737b4 (diff)
downloadjquery-ui-8cc5bae1caa1fcf96bf5862c5646c787020ba3f9.tar.gz
jquery-ui-8cc5bae1caa1fcf96bf5862c5646c787020ba3f9.zip
Checkboxradio: Don't re-evaluate text labels as HTML
If you generate a Checkboxradio from a checkbox/radio with a label that contains encoded HTML, e.g. `&lt;em&gt;test&lt;/em&gt;` this will work fine at first. If, however a refresh is triggered on that instance (explicitly or e.g. by turning it into a `Controlgroup`), the previously escaped HTML will now be evaluated. If the label was created based on some user input, this could lead to unexpected code execution even though the initial output was escaped. Fixes gh-2101 Closes gh-2102
-rw-r--r--tests/unit/checkboxradio/checkboxradio.html12
-rw-r--r--tests/unit/checkboxradio/core.js37
-rw-r--r--tests/unit/checkboxradio/methods.js38
-rw-r--r--ui/widgets/checkboxradio.js21
4 files changed, 100 insertions, 8 deletions
diff --git a/tests/unit/checkboxradio/checkboxradio.html b/tests/unit/checkboxradio/checkboxradio.html
index 9883e0834..62552fefc 100644
--- a/tests/unit/checkboxradio/checkboxradio.html
+++ b/tests/unit/checkboxradio/checkboxradio.html
@@ -64,6 +64,18 @@
<label>
<input type="checkbox" id="label-with-no-for"/>
</label>
+<label>
+ <input type="checkbox" id="label-with-no-for-with-html"/>
+ <strong>Hi</strong>, <em>I'm a label</em>
+</label>
+<label>
+ <input type="checkbox" id="label-with-no-for-with-text"/>
+ Hi, I'm a label
+</label>
+<label>
+ <input type="checkbox" id="label-with-no-for-with-html-like-text"/>
+ &lt;em&gt;Hi, I'm a label&lt;/em&gt;
+</label>
<form id="form3"></form>
<input type="radio" name="crazy-form" id="crazy-form-1" form="form3" checked="checked">
diff --git a/tests/unit/checkboxradio/core.js b/tests/unit/checkboxradio/core.js
index 8b0e1de8e..ad27f1be0 100644
--- a/tests/unit/checkboxradio/core.js
+++ b/tests/unit/checkboxradio/core.js
@@ -131,4 +131,41 @@ QUnit.test( "Calling checkboxradio on an input with no label throws an error", f
);
} );
+QUnit.test( "Inheriting label from initial HTML", function( assert ) {
+ var tests = [
+ {
+ id: "label-with-no-for-with-html",
+ expectedLabel: "<strong>Hi</strong>, <em>I'm a label</em>"
+ },
+ {
+ id: "label-with-no-for-with-text",
+ expectedLabel: "Hi, I'm a label"
+ },
+ {
+ id: "label-with-no-for-with-html-like-text",
+ expectedLabel: "&lt;em&gt;Hi, I'm a label&lt;/em&gt;"
+ }
+ ];
+
+ assert.expect( tests.length );
+
+ tests.forEach( function( testData ) {
+ var id = testData.id;
+ var expectedLabel = testData.expectedLabel;
+ var inputElem = $( "#" + id );
+ var labelElem = inputElem.parent();
+
+ inputElem.checkboxradio( { icon: false } );
+
+ var labelWithoutInput = labelElem.clone();
+ labelWithoutInput.find( "input" ).remove();
+
+ assert.strictEqual(
+ labelWithoutInput.html().trim(),
+ expectedLabel.trim(),
+ "Label correct [" + id + "]"
+ );
+ } );
+} );
+
} );
diff --git a/tests/unit/checkboxradio/methods.js b/tests/unit/checkboxradio/methods.js
index 09510ec71..f6c94f94f 100644
--- a/tests/unit/checkboxradio/methods.js
+++ b/tests/unit/checkboxradio/methods.js
@@ -96,4 +96,42 @@ QUnit.test( "Input wrapped in a label preserved on refresh", function( assert )
assert.strictEqual( input.parent()[ 0 ], element[ 0 ], "Input preserved" );
} );
+QUnit.test( "Initial text label not turned to HTML on refresh", function( assert ) {
+ var tests = [
+ {
+ id: "label-with-no-for-with-html",
+ expectedLabel: "<strong>Hi</strong>, <em>I'm a label</em>"
+ },
+ {
+ id: "label-with-no-for-with-text",
+ expectedLabel: "Hi, I'm a label"
+ },
+ {
+ id: "label-with-no-for-with-html-like-text",
+ expectedLabel: "&lt;em&gt;Hi, I'm a label&lt;/em&gt;"
+ }
+ ];
+
+ assert.expect( tests.length );
+
+ tests.forEach( function( testData ) {
+ var id = testData.id;
+ var expectedLabel = testData.expectedLabel;
+ var inputElem = $( "#" + id );
+ var labelElem = inputElem.parent();
+
+ inputElem.checkboxradio( { icon: false } );
+ inputElem.checkboxradio( "refresh" );
+
+ var labelWithoutInput = labelElem.clone();
+ labelWithoutInput.find( "input" ).remove();
+
+ assert.strictEqual(
+ labelWithoutInput.html().trim(),
+ expectedLabel.trim(),
+ "Label correct [" + id + "]"
+ );
+ } );
+} );
+
} );
diff --git a/ui/widgets/checkboxradio.js b/ui/widgets/checkboxradio.js
index b2537d292..afa4a446d 100644
--- a/ui/widgets/checkboxradio.js
+++ b/ui/widgets/checkboxradio.js
@@ -50,8 +50,7 @@ $.widget( "ui.checkboxradio", [ $.ui.formResetMixin, {
},
_getCreateOptions: function() {
- var disabled, labels;
- var that = this;
+ var disabled, labels, labelContents;
var options = this._super() || {};
// We read the type here, because it makes more sense to throw a element type error first,
@@ -71,12 +70,18 @@ $.widget( "ui.checkboxradio", [ $.ui.formResetMixin, {
// We need to get the label text but this may also need to make sure it does not contain the
// input itself.
- this.label.contents().not( this.element[ 0 ] ).each( function() {
-
- // The label contents could be text, html, or a mix. We concat each element to get a
- // string representation of the label, without the input as part of it.
- that.originalLabel += this.nodeType === 3 ? $( this ).text() : this.outerHTML;
- } );
+ // The label contents could be text, html, or a mix. We wrap all elements
+ // and read the wrapper's `innerHTML` to get a string representation of
+ // the label, without the input as part of it.
+ labelContents = this.label.contents().not( this.element[ 0 ] );
+
+ if ( labelContents.length ) {
+ this.originalLabel += labelContents
+ .clone()
+ .wrapAll( "<div></div>" )
+ .parent()
+ .html();
+ }
// Set the label option if we found label text
if ( this.originalLabel ) {