Fix minor TimingFunction validation issue #8910

Merged
merged 4 commits into from Sep 9, 2014

Projects

None yet

2 participants

@MarcelGerber
Member

This fixes a rather uncommon issue in TimingFunction validation. Steps:

  1. Try to open an Inline Editor on animation-timing-function: cubic-bezier(0, 0, 0, 0,) (notice the trailing comma)

Result: Console error, no inline editor
Expected: Inline editor should auto-correct the invalid function

@redmunds redmunds self-assigned this Sep 2, 2014
@redmunds redmunds commented on an outdated diff Sep 8, 2014
...ult/InlineTimingFunctionEditor/TimingFunctionUtils.js
}
var val = parseFloat(str, 10),
- isNum = (typeof (val) === "number") && !isNaN(val) &&
+ isNum = (typeof val === "number") && !isNaN(val) &&
(val !== Infinity) && (val !== -Infinity);
@redmunds
redmunds Sep 8, 2014 Contributor

@MarcelGerber This is an interesting case. Due to the regex used to parse the cubic-bezier string, the last value is "everything past the 3rd comma and past whitespace". So there could be a lot of weird stuff in here -- too much I think to try to parse with our own regex.

So, I looked at the code that currently traps the exception and it's using the unary operator to convert from string to number. I think we still need parseFloat to make sure it's a base 10 number, but this code seems to be simpler, solve the problem, and all unit tests still work:

        if (typeof str !== "string") {
            return { isNumber: false, value: null };
        }

        var val = parseFloat(+str, 10),
            isNum = (typeof val === "number") && !isNaN(val) &&
                    (val !== Infinity) && (val !== -Infinity);

What do you think of this solution?

@redmunds
Contributor
redmunds commented Sep 8, 2014

Code review complete. I think this can be solved without a new regex.

@MarcelGerber
Member

@redmunds Your solution works well, therefore I used it.

@redmunds redmunds commented on the diff Sep 9, 2014
...sions/default/InlineTimingFunctionEditor/unittests.js
@@ -215,6 +215,9 @@ define(function (require, exports, module) {
it("should correct cubic-bezier function with 5 parameters", function () {
testInvalidBezier("cubic-bezier(0, 0, 1, 1, 1)", ["cubic-bezier(0, 0, 1, 1)", "0", "0", "1", "1"]);
});
+ it("should correct cubic-bezier function with trailing comma", function () {
@redmunds
redmunds Sep 9, 2014 Contributor

Yay! Unit test!

@redmunds
Contributor
redmunds commented Sep 9, 2014

Good catch. Merging.

@redmunds redmunds merged commit 49e2004 into adobe:master Sep 9, 2014

1 check passed

continuous-integration/travis-ci The Travis CI build passed
Details
@MarcelGerber MarcelGerber deleted the MarcelGerber:timing-function-editor-exception branch Sep 10, 2014
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment