Update slowparse to deal with @keyframes

RESOLVED FIXED

Status

Webmaker
Thimble
RESOLVED FIXED
5 years ago
5 years ago

People

(Reporter: aklee237, Assigned: pomax)

Tracking

Details

Attachments

(2 attachments)

(Reporter)

Description

5 years ago
Created attachment 782584 [details]
spaceinvaders.html

User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.72 Safari/537.36

Steps to reproduce:

This is my CSS

@keyframes animation1
    {
      /*Change where the cloud starts */      
0% { left: 260px; top: -10%; }
      /* Change where it ends */
100% { left: 260px; top: 100%; }
}
    


Actual results:

Thimble gives an error message stating

"Missing block closer or next property:value; pair following @keyframes animation1."


Expected results:

it should just work
(Assignee)

Comment 1

5 years ago
This is a SlowParse issue, caused by the nessted {} blocks. Its parsing rules will have to be updated for allowing nesting in specific @syntax contexts
Assignee: nobody → pomax
Status: UNCONFIRMED → ASSIGNED
Ever confirmed: true
(Reporter)

Comment 2

5 years ago
thanks for the reply,

anything i can do to help out? https://github.com/mozilla/slowparse

I'm trying to get this ready for the Hive NYC maker party on Thur
(Assignee)

Comment 3

5 years ago
if you want to give updating it a shot: _parseDeclaration needs to become aware of the extra rules involved in parsing @keyframe's nested blocks, rather than parsing individual properties. We're hampered a little here because slowparse is effectivly a DFA and runs through the sequence

parseSelector -> parseDeclaration -> parseProperty -> parseValue -> (parseDeclaration or parseSelector)

so as a closed loop, busting this open with special rules for @keyframes will either have to set up a second loop,

1. parseSelector -> parseDeclaration -> (parseProperty OR parseKeyframeRules)
2a. parseProperty -> parseValue -> (parseDeclaration or parseSelector)
2b. parseKeyframeRules -> parseIndicator -> parseBlock

where parseBlock somehow does the same as the property/value chain without ending up calling parseDeclaration, because then we end up in the wrong route.

This got shelved quite a while ago because it was a fairly hard problem to solve cleanly, so if you want to try to add this in, you would be a true hero, although I don't know if there would be enough time to make it work before Thursday while keeping it test driven (then again, sometimes one day is plenty if you have a brainwave that lets you write exactly the code you needed)
(Reporter)

Comment 4

5 years ago
thanks for the tips. won't get to it in time for this Thur but I do want to solve this in time for the NYC Maker Faire
(Assignee)

Comment 5

5 years ago
unassigning pending reprioritisation
Assignee: pomax → nobody
Status: ASSIGNED → NEW
(Assignee)

Updated

5 years ago
Duplicate of this bug: 931376
(Assignee)

Updated

5 years ago
Summary: Can't @keyframes to work → Update slowparse to deal with @keyframes
(Assignee)

Updated

5 years ago
Assignee: nobody → pomax
Status: NEW → ASSIGNED
(Assignee)

Comment 7

5 years ago
Created attachment 8377830 [details] [review]
https://github.com/mozilla/thimble.webmaker.org/pull/360

if you think of pass/fail tests, please let me know and we can add them.
Attachment #8377830 - Flags: review?(ali)
Comment on attachment 8377830 [details] [review]
https://github.com/mozilla/thimble.webmaker.org/pull/360

All tests passed really good patch!
Attachment #8377830 - Flags: review?(ali) → review+
(Assignee)

Updated

5 years ago
Status: ASSIGNED → RESOLVED
Last Resolved: 5 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.