Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit e37b3b8

Browse files
fix: do no handle identifier in nested functions (#60)
1 parent 7942f72 commit e37b3b8

File tree

2 files changed

+65
-30
lines changed

2 files changed

+65
-30
lines changed

‎src/index.js

Lines changed: 29 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -302,15 +302,6 @@ function localizeDeclNode(node, context) {
302302
return node;
303303
}
304304

305-
function isWordAFunctionArgument(wordNode, functionNode) {
306-
return functionNode
307-
? functionNode.nodes.some(
308-
(functionNodeChild) =>
309-
functionNodeChild.sourceIndex === wordNode.sourceIndex
310-
)
311-
: false;
312-
}
313-
314305
// `none` is special value, other is global values
315306
const specialKeywords = [
316307
"none",
@@ -373,51 +364,59 @@ function localizeDeclaration(declaration, context) {
373364
animation name of infinite from the second.
374365
*/
375366
const animationKeywords = {
367+
// animation-direction
368+
$normal: 1,
369+
$reverse: 1,
376370
$alternate: 1,
377371
"$alternate-reverse": 1,
372+
// animation-fill-mode
373+
$forwards: 1,
378374
$backwards: 1,
379375
$both: 1,
376+
// animation-iteration-count
377+
$infinite: 1,
378+
// animation-play-state
379+
$paused: 1,
380+
$running: 1,
381+
// animation-timing-function
380382
$ease: 1,
381383
"$ease-in": 1,
382-
"$ease-in-out": 1,
383384
"$ease-out": 1,
384-
$forwards: 1,
385-
$infinite: 1,
385+
"$ease-in-out": 1,
386386
$linear: 1,
387-
$none: Infinity, // No matter how many times you write none, it will never be an animation name
388-
$normal: 1,
389-
$paused: 1,
390-
$reverse: 1,
391-
$running: 1,
392387
"$step-end": 1,
393388
"$step-start": 1,
389+
// Special
390+
$none: Infinity, // No matter how many times you write none, it will never be an animation name
391+
// Global values
394392
$initial: Infinity,
395393
$inherit: Infinity,
396394
$unset: Infinity,
397395
$revert: Infinity,
398396
"$revert-layer": Infinity,
399397
};
400-
401-
const didParseAnimationName = false;
402398
let parsedAnimationKeywords = {};
403-
let stepsFunctionNode = null;
404399
const valueNodes = valueParser(declaration.value).walk((node) => {
405-
/* If div-token appeared (represents as comma ','), a possibility of an animation-keywords should be reflesh. */
400+
// If div-token appeared (represents as comma ','), a possibility of an animation-keywords should be reflesh.
406401
if (node.type === "div") {
407402
parsedAnimationKeywords = {};
403+
404+
return;
405+
}
406+
// Do not handle nested functions
407+
else if (node.type === "function") {
408+
return false;
408409
}
409-
if (node.type === "function" && node.value.toLowerCase() === "steps") {
410-
stepsFunctionNode = node;
410+
// Ignore all except word
411+
else if (node.type !== "word") {
412+
return;
411413
}
412-
const value =
413-
node.type === "word" &&
414-
!isWordAFunctionArgument(node, stepsFunctionNode)
415-
? node.value.toLowerCase()
416-
: null;
414+
415+
const value = node.type === "word" ? node.value.toLowerCase() : null;
417416

418417
let shouldParseAnimationName = false;
419418

420-
if (!didParseAnimationName&&value && validIdent.test(value)) {
419+
if (value && validIdent.test(value)) {
421420
if ("$" + value in animationKeywords) {
422421
parsedAnimationKeywords["$" + value] =
423422
"$" + value in parsedAnimationKeywords
@@ -438,6 +437,7 @@ function localizeDeclaration(declaration, context) {
438437
localizeNextItem: shouldParseAnimationName && !context.global,
439438
localAliasMap: context.localAliasMap,
440439
};
440+
441441
return localizeDeclNode(node, subContext);
442442
});
443443

‎test/index.test.js

Lines changed: 36 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -250,16 +250,51 @@ const tests = [
250250
input: ".foo { animation: --foo; }",
251251
expected: ":local(.foo) { animation: :local(--foo); }",
252252
},
253+
{
254+
name: "not localize name in nested function",
255+
input: ".foo { animation: fade .2s var(--easeOutQuart) .1s forwards }",
256+
expected:
257+
":local(.foo) { animation: :local(fade) .2s var(--easeOutQuart) .1s forwards }",
258+
},
259+
{
260+
name: "not localize name in nested function #2",
261+
input: ".foo { animation: fade .2s env(FOO_BAR) .1s forwards, name }",
262+
expected:
263+
":local(.foo) { animation: :local(fade) .2s env(FOO_BAR) .1s forwards, :local(name) }",
264+
},
265+
{
266+
name: "not localize name in nested function #3",
267+
input: ".foo { animation: var(--foo-bar) .1s forwards, name }",
268+
expected:
269+
":local(.foo) { animation: var(--foo-bar) .1s forwards, :local(name) }",
270+
},
271+
{
272+
name: "not localize name in nested function #3",
273+
input: ".foo { animation: var(--foo-bar) .1s forwards name, name }",
274+
expected:
275+
":local(.foo) { animation: var(--foo-bar) .1s forwards :local(name), :local(name) }",
276+
},
253277
{
254278
name: "localize animation",
255279
input: ".foo { animation: a; }",
256280
expected: ":local(.foo) { animation: :local(a); }",
257281
},
258282
{
259-
name: "localize animation",
283+
name: "localize animation #2",
260284
input: ".foo { animation: bar 5s, foobar; }",
261285
expected: ":local(.foo) { animation: :local(bar) 5s, :local(foobar); }",
262286
},
287+
{
288+
name: "localize animation #3",
289+
input: ".foo { animation: ease ease; }",
290+
expected: ":local(.foo) { animation: ease :local(ease); }",
291+
},
292+
{
293+
name: "localize animation #4",
294+
input: ".foo { animation: 0s ease 0s 1 normal none test running; }",
295+
expected:
296+
":local(.foo) { animation: 0s ease 0s 1 normal none :local(test) running; }",
297+
},
263298
{
264299
name: "localize animation with vendor prefix",
265300
input: ".foo { -webkit-animation: bar; animation: bar; }",

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /