Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "maquette",
"version": "4.1.1",
"version": "4.1.2",
"description": "Minimalistic Virtual DOM implementation with support for animated transitions.",
"homepage": "https://maquettejs.org/",
"keywords": [
Expand Down
15 changes: 1 addition & 14 deletions src/projection.ts
Original file line number Diff line number Diff line change
Expand Up @@ -231,16 +231,6 @@ let setProperties = (
if (eventHandlerInterceptor) {
propValue = eventHandlerInterceptor(propName, propValue, domNode, properties); // intercept eventhandlers
}
if (propName === "oninput") {
(function () {
// record the evt.target.value, because IE and Edge sometimes do a requestAnimationFrame between changing value and running oninput
let oldPropValue = propValue;
propValue = function (this: HTMLElement, evt: Event) {
oldPropValue.apply(this, [evt]);
(evt.target as any)["oninput-value"] = (evt.target as HTMLInputElement).value; // may be HTMLTextAreaElement as well
};
})();
}
}
(domNode as any)[propName] = propValue;
} else if (projectionOptions.namespace === NAMESPACE_SVG) {
Expand Down Expand Up @@ -443,13 +433,10 @@ let updateProperties = (
let domValue = (domNode as any)[propName];
if (
domValue !== propValue && // The 'value' in the DOM tree !== newValue
((domNode as any)["oninput-value"]
? domValue === (domNode as any)["oninput-value"] // If the last reported value to 'oninput' does not match domValue, do nothing and wait for oninput
: propValue !== previousValue) // Only update the value if the vdom changed
propValue !== previousValue // Only update the value if the vdom changed
) {
// The edge cases are described in the tests
(domNode as any)[propName] = propValue; // Reset the value, even if the virtual DOM did not change
(domNode as any)["oninput-value"] = undefined;
} // else do not update the domNode, otherwise the cursor position would be changed
if (propValue !== previousValue) {
propertiesUpdated = true;
Expand Down
28 changes: 0 additions & 28 deletions test/dom/properties-tests.ts
Original file line number Diff line number Diff line change
Expand Up @@ -169,34 +169,6 @@ describe("dom", () => {
});

describe("event handlers", () => {
it("allows one to correct the value while being typed", () => {
// Here we are trying to trim the value to 2 characters
let typedKeys = "";
let handleInput = (evt: Event) => {
typedKeys = (evt.target as HTMLInputElement).value.substr(0, 2);
};
let renderFunction = () => h("input", { value: typedKeys, oninput: handleInput });
let projection = dom.create(renderFunction(), {
eventHandlerInterceptor: noopEventHandlerInterceptor,
});
let inputElement = projection.domNode as HTMLInputElement;
expect(inputElement.value).to.equal(typedKeys);

// No correction
inputElement.value = "ab";
inputElement.oninput({ target: inputElement } as any);
expect(typedKeys).to.equal("ab");
projection.update(renderFunction());
expect(inputElement.value).to.equal("ab");

// Correction kicking in
inputElement.value = "abc";
inputElement.oninput({ target: inputElement } as any);
expect(typedKeys).to.equal("ab");
projection.update(renderFunction());
expect(inputElement.value).to.equal("ab");
});

it("does not undo keystrokes, even if a browser runs an animationFrame between changing the value property and running oninput", () => {
// Crazy internet explorer behavior
let typedKeys = "";
Expand Down
Loading