From 8f4aa84f1a4f2443b34d81ee42490564e168de53 Mon Sep 17 00:00:00 2001 From: YuKun Liu <41265098+mrxiaozhuox@users.noreply.github.com> Date: Sun, 9 Jan 2022 02:02:23 +0800 Subject: [PATCH 1/2] feat: bool attr white list --- examples/disabled.rs | 5 +++++ packages/desktop/src/index.js | 32 +++++++++++++++++++++++++++++++- packages/web/src/dom.rs | 32 +++++++++++++++++++++++++++++++- 3 files changed, 67 insertions(+), 2 deletions(-) diff --git a/examples/disabled.rs b/examples/disabled.rs index e4ca7d9ee..390a5550f 100644 --- a/examples/disabled.rs +++ b/examples/disabled.rs @@ -18,6 +18,11 @@ fn app(cx: Scope) -> Element { disabled: "{disabled}", "lower button" } + + input { + value: "false", + } + } }) } diff --git a/packages/desktop/src/index.js b/packages/desktop/src/index.js index 931eb7d32..e6ee2e765 100644 --- a/packages/desktop/src/index.js +++ b/packages/desktop/src/index.js @@ -369,8 +369,38 @@ class Interpreter { node.innerHTML = value; break; default: + + const bool_attrs = [ + "allowfullscreen", + "allowpaymentrequest", + "async", + "autofocus", + "autoplay", + "checked", + "controls", + "default", + "defer", + "disabled", + "formnovalidate", + "hidden", + "ismap", + "itemscope", + "loop", + "multiple", + "muted", + "nomodule", + "novalidate", + "open", + "playsinline", + "readonly", + "required", + "reversed", + "selected", + "truespeed", + ] + // https://github.com/facebook/react/blob/8b88ac2592c5f555f315f9440cbb665dd1e7457a/packages/react-dom/src/shared/DOMProperty.js#L352-L364 - if (value == "false" && name != "capture" && name != "download") { + if (value == "false" && bool_attrs.indexOf(name)) { node.removeAttribute(name); } else { node.setAttribute(name, value); diff --git a/packages/web/src/dom.rs b/packages/web/src/dom.rs index e9cf66af2..3f38943d4 100644 --- a/packages/web/src/dom.rs +++ b/packages/web/src/dom.rs @@ -348,8 +348,38 @@ impl WebsysDom { } } _ => { + + let bool_attrs = vec![ + "allowfullscreen", + "allowpaymentrequest", + "async", + "autofocus", + "autoplay", + "checked", + "controls", + "default", + "defer", + "disabled", + "formnovalidate", + "hidden", + "ismap", + "itemscope", + "loop", + "multiple", + "muted", + "nomodule", + "novalidate", + "open", + "playsinline", + "readonly", + "required", + "reversed", + "selected", + "truespeed", + ]; + // https://github.com/facebook/react/blob/8b88ac2592c5f555f315f9440cbb665dd1e7457a/packages/react-dom/src/shared/DOMProperty.js#L352-L364 - if value == "false" && ((name != "capture") && (name != "download")) { + if value == "false" && bool_attrs.contains(&name) { if let Some(el) = node.dyn_ref::() { let _ = el.remove_attribute(name); } From 92561612c727e73356d7d36e16af39aacf02a56d Mon Sep 17 00:00:00 2001 From: YuKun Liu <41265098+mrxiaozhuox@users.noreply.github.com> Date: Sun, 9 Jan 2022 02:25:11 +0800 Subject: [PATCH 2/2] fix: format code --- packages/desktop/src/index.js | 59 +++++++++++++++---------------- packages/web/src/dom.rs | 66 ++++++++++++++++++----------------- 2 files changed, 63 insertions(+), 62 deletions(-) diff --git a/packages/desktop/src/index.js b/packages/desktop/src/index.js index e6ee2e765..75b838b02 100644 --- a/packages/desktop/src/index.js +++ b/packages/desktop/src/index.js @@ -1,3 +1,32 @@ +const bool_attrs = [ + "allowfullscreen", + "allowpaymentrequest", + "async", + "autofocus", + "autoplay", + "checked", + "controls", + "default", + "defer", + "disabled", + "formnovalidate", + "hidden", + "ismap", + "itemscope", + "loop", + "multiple", + "muted", + "nomodule", + "novalidate", + "open", + "playsinline", + "readonly", + "required", + "reversed", + "selected", + "truespeed", +] + function serialize_event(event) { switch (event.type) { case "copy": @@ -369,36 +398,6 @@ class Interpreter { node.innerHTML = value; break; default: - - const bool_attrs = [ - "allowfullscreen", - "allowpaymentrequest", - "async", - "autofocus", - "autoplay", - "checked", - "controls", - "default", - "defer", - "disabled", - "formnovalidate", - "hidden", - "ismap", - "itemscope", - "loop", - "multiple", - "muted", - "nomodule", - "novalidate", - "open", - "playsinline", - "readonly", - "required", - "reversed", - "selected", - "truespeed", - ] - // https://github.com/facebook/react/blob/8b88ac2592c5f555f315f9440cbb665dd1e7457a/packages/react-dom/src/shared/DOMProperty.js#L352-L364 if (value == "false" && bool_attrs.indexOf(name)) { node.removeAttribute(name); diff --git a/packages/web/src/dom.rs b/packages/web/src/dom.rs index 3f38943d4..364f1a1d7 100644 --- a/packages/web/src/dom.rs +++ b/packages/web/src/dom.rs @@ -348,40 +348,42 @@ impl WebsysDom { } } _ => { - - let bool_attrs = vec![ - "allowfullscreen", - "allowpaymentrequest", - "async", - "autofocus", - "autoplay", - "checked", - "controls", - "default", - "defer", - "disabled", - "formnovalidate", - "hidden", - "ismap", - "itemscope", - "loop", - "multiple", - "muted", - "nomodule", - "novalidate", - "open", - "playsinline", - "readonly", - "required", - "reversed", - "selected", - "truespeed", - ]; - // https://github.com/facebook/react/blob/8b88ac2592c5f555f315f9440cbb665dd1e7457a/packages/react-dom/src/shared/DOMProperty.js#L352-L364 - if value == "false" && bool_attrs.contains(&name) { + if value == "false" { if let Some(el) = node.dyn_ref::() { - let _ = el.remove_attribute(name); + match name { + "allowfullscreen" + | "allowpaymentrequest" + | "async" + | "autofocus" + | "autoplay" + | "checked" + | "controls" + | "default" + | "defer" + | "disabled" + | "formnovalidate" + | "hidden" + | "ismap" + | "itemscope" + | "loop" + | "multiple" + | "muted" + | "nomodule" + | "novalidate" + | "open" + | "playsinline" + | "readonly" + | "required" + | "reversed" + | "selected" + | "truespeed" => { + let _ = el.remove_attribute(name); + } + _ => { + let _ = el.set_attribute(name, value); + } + }; } } else { fallback();