admin管理员组文章数量:1320614
I tried to find examples where the formStateRestoreCallback
lifecycle hook could return autocomplete
as the second reason
argument, but I didn't find anything.
Here is a quote from the specification:
When user agent updates a form-associated custom element's value on behalf of a user or as part of navigation, its formStateRestoreCallback is called, given the new state and a string indicating a reason, "autocomplete" or "restore", as arguments.
To get the reason
with restore
you just need to refresh the page with a certain custom element on the page (don't fet to use setFormValue
)
customElements.define(
"my-input",
class extends HTMLElement {
constructor() {
super();
this.internals_ = this.attachInternals();
this.internals_.setFormValue("sendData", "localData");
}
static get formAssociated() {
return true;
}
connectedCallback() {
console.log("connectedCallback has been invoked");
}
formResetCallback() {
console.log("formResetCallback has been invoked");
}
formStateRestoreCallback(state, mode){
console.log("formStateRestoreCallback:", state, mode);
}
}
);
but what do you need to do to get autocomplete
?
Does anyone know if this thing works?
I tried to find examples where the formStateRestoreCallback
lifecycle hook could return autocomplete
as the second reason
argument, but I didn't find anything.
Here is a quote from the specification:
When user agent updates a form-associated custom element's value on behalf of a user or as part of navigation, its formStateRestoreCallback is called, given the new state and a string indicating a reason, "autocomplete" or "restore", as arguments.
To get the reason
with restore
you just need to refresh the page with a certain custom element on the page (don't fet to use setFormValue
)
customElements.define(
"my-input",
class extends HTMLElement {
constructor() {
super();
this.internals_ = this.attachInternals();
this.internals_.setFormValue("sendData", "localData");
}
static get formAssociated() {
return true;
}
connectedCallback() {
console.log("connectedCallback has been invoked");
}
formResetCallback() {
console.log("formResetCallback has been invoked");
}
formStateRestoreCallback(state, mode){
console.log("formStateRestoreCallback:", state, mode);
}
}
);
but what do you need to do to get autocomplete
?
Does anyone know if this thing works?
Share Improve this question edited Jan 18 at 9:40 MaximPro asked Jan 18 at 9:34 MaximProMaximPro 5421 gold badge8 silver badges24 bronze badges 5 |1 Answer
Reset to default 1 +50In the same document, a bit later you can see the specs say
If the user agent has a form-filling assist feature
I suspect this means some kind of AT.
Interestingly, WPT only checks that the property is visited, but not that the callback is ever called, not even with "restore".
And none of the "big 3" browsers seem to have implemented the "autocomplete" when they did implement formStateRestoreCallback
.
- Webkit's PR clearly states
This change implements form-associated custom elements as per spec [1], with exception of
formStateRestoreCallback()
being called for autofill and support of File interface for saving / restoring state.
(emphasize mine)
Firefox's has pretty much the same:
Note that 'autocomplete' for custom elements remains unsupported.
And in Chrome, while they do define the "autocomplete"
mode, walking up the call hierarchy of CustomElementFormStateRestoreCallbackReaction()
, we end up at a single, CustomElement::EnqueueFormStateRestoreCallback(Target(), restored_state,"restore")
with an hardcoded "restore"
mode, no "autocomplete"
ever.
Maybe other user agents do call it though. And for it to be called, you'd need to follow the same rules as for autocomplete
to work: have your element with an name
or id
attribute, in a <form>
with a submit button.
本文标签:
版权声明:本文标题:javascript - When do custom elements invoke lifecycle hook formStateRestoreCallback with reason argument equal to "auto 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742077625a2419501.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
"restore"
. And even quickly looking at Chromium's source, while they do define both modes, following the call hierarchy we end up at a single hardcodedCustomElement::EnqueueFormStateRestoreCallback(Target(), restored_state,"restore");
– Kaiido Commented Jan 21 at 1:25"restore"
works. By the way in that article Ryosuke Niwa writes:Note that WebKit currently has a limitation that only string can be used for the state, and “autocomplete” is not supported yet.
– MaximPro Commented Jan 21 at 1:31"autocomplete"
case. – Kaiido Commented Jan 21 at 1:38formResetCallback
. I'm not calling for anything :) – MaximPro Commented Jan 21 at 1:43