From 5390bc11d638df92497a0978759844a744d1e463 Mon Sep 17 00:00:00 2001 From: FORCHA PEARL Date: Thu, 8 Aug 2024 14:56:14 +0100 Subject: [PATCH 1/3] removed parent div from check box element --- src/dom/dom.js | 26 ++++++++++---------------- 1 file changed, 10 insertions(+), 16 deletions(-) diff --git a/src/dom/dom.js b/src/dom/dom.js index d22f8ba901..3320dd761d 100644 --- a/src/dom/dom.js +++ b/src/dom/dom.js @@ -1104,9 +1104,6 @@ p5.prototype.createButton = function (label, value) { p5.prototype.createCheckbox = function(...args) { p5._validateParameters('createCheckbox', args); - // Create a container element - const elt = document.createElement('div'); - // Create checkbox type input element const checkbox = document.createElement('input'); checkbox.type = 'checkbox'; @@ -1115,22 +1112,19 @@ p5.prototype.createCheckbox = function(...args) { const label = document.createElement('label'); label.appendChild(checkbox); - // Append label element inside the container - elt.appendChild(label); - //checkbox must be wrapped in p5.Element before label so that label appears after - const self = addElement(elt, this); + const self = addElement(label, this); + + // Append the checkbox to the label + label.appendChild(checkbox); self.checked = function(...args) { - const cb = self.elt.firstElementChild.getElementsByTagName('input')[0]; - if (cb) { - if (args.length === 0) { - return cb.checked; - } else if (args[0]) { - cb.checked = true; - } else { - cb.checked = false; - } + if (args.length === 0) { + return cb.checked; + } else if (args[0]) { + cb.checked = true; + } else { + cb.checked = false; } return self; }; From 054e207decbacbfee2156102819191b1392240c0 Mon Sep 17 00:00:00 2001 From: FORCHA PEARL Date: Tue, 20 Aug 2024 16:37:57 +0100 Subject: [PATCH 2/3] fixed cb is undefined --- src/dom/dom.js | 22 ++++++++++------------ 1 file changed, 10 insertions(+), 12 deletions(-) diff --git a/src/dom/dom.js b/src/dom/dom.js index 3320dd761d..64942f093a 100644 --- a/src/dom/dom.js +++ b/src/dom/dom.js @@ -1107,26 +1107,24 @@ p5.prototype.createCheckbox = function(...args) { // Create checkbox type input element const checkbox = document.createElement('input'); checkbox.type = 'checkbox'; - // Create label element and wrap it around checkbox const label = document.createElement('label'); - label.appendChild(checkbox); - - //checkbox must be wrapped in p5.Element before label so that label appears after + //checkbox must be wrapped in label const self = addElement(label, this); - // Append the checkbox to the label label.appendChild(checkbox); self.checked = function(...args) { - if (args.length === 0) { - return cb.checked; - } else if (args[0]) { - cb.checked = true; - } else { - cb.checked = false; + const cb = self.elt.getElementsByTagName('input')[0]; + if (cb) { + if (args.length === 0) { + return cb.checked; + } else if (args[0]) { + cb.checked = true; + } else { + cb.checked = false; + } } - return self; }; this.value = function (val) { From a2b081596d086680382d5f2bd5c7639a2449b7fa Mon Sep 17 00:00:00 2001 From: FORCHA PEARL Date: Tue, 20 Aug 2024 16:39:37 +0100 Subject: [PATCH 3/3] removed first element child query on div container --- test/unit/dom/dom.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/test/unit/dom/dom.js b/test/unit/dom/dom.js index 0ab5bb66dd..dccf105a3a 100644 --- a/test/unit/dom/dom.js +++ b/test/unit/dom/dom.js @@ -648,13 +648,13 @@ suite('DOM', function() { // helper functions const getSpanElement = el => - el.elt.firstElementChild.getElementsByTagName('span').length - ? el.elt.firstElementChild.getElementsByTagName('span')[0] + el.elt.getElementsByTagName('span').length + ? el.elt.getElementsByTagName('span')[0] : null; const getCheckboxElement = el => - el.elt.firstElementChild.getElementsByTagName('input').length - ? el.elt.firstElementChild.getElementsByTagName('input')[0] + el.elt.getElementsByTagName('input').length + ? el.elt.getElementsByTagName('input')[0] : null; test('should be a function', function() {