Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

background shorthand doesn't parse anything after "position / size" #15199

Closed
upsuper opened this issue Jan 25, 2017 · 15 comments
Closed

background shorthand doesn't parse anything after "position / size" #15199

upsuper opened this issue Jan 25, 2017 · 15 comments
Assignees
Labels
A-content/css Interacting with CSS from web content (parsing, serializing, introspection) C-assigned There is someone working on resolving the issue

Comments

@upsuper
Copy link
Contributor

upsuper commented Jan 25, 2017

The issue is that, the following code parses:

background: left top / auto;

but the following doesn't:

background: left top / auto none;

As far as I can see, anything in the same background item after the "position / size" syntax is rejected.

I tried to look into the code, but I failed to find anything wrong there.

@upsuper upsuper added the A-content/css Interacting with CSS from web content (parsing, serializing, introspection) label Jan 25, 2017
@atheed
Copy link
Contributor

atheed commented Jan 30, 2017

I might be wrong, but I think this is because left top / auto none is syntactically malformed. The problem is the none: it is a keyword that cannot be applied to background-size, nor to any of the CSS rules that can follow background-size in the background shorthand (that is, background-repeat, background-attachment, background-origin, background-clip, and background-color).
I think the other major browsers also don't parse background: left top / auto none; for this reason.

@upsuper
Copy link
Contributor Author

upsuper commented Jan 30, 2017

none is a valid value for background-image which is part of background shorthand, and all major browsers certainly parse left top / auto none. It is not the problem of none, but it seems to me nothing would get parsed after left top / auto including no-repeat and others.

(I think that was what I saw when I last checked. I don't have a working servo build at the moment...)

@atheed
Copy link
Contributor

atheed commented Jan 30, 2017

I think the background-image rule must strictly precede background-position and background-size when using the background shorthand, no? So a none applied to background-image must come before the "position / size"?

I did a quick check, and it appears Servo successfully parses something like this <div style="background: url(\'http://servo/test.png\') left top / auto auto repeat-x fixed padding-box content-box red;"> (a slightly-manipulated version of https://github.com/servo/servo/blob/master/tests/unit/style/parsing/background.rs#L19-L20) but not <div style="background: url(\'http://servo/test.png\') left top / auto none repeat-x fixed padding-box content-box red;"> (with none being the only change).

@upsuper
Copy link
Contributor Author

upsuper commented Jan 30, 2017

Because in your last case, background-image has already been occupied by the url value, the additional none is surely invalid.

@atheed
Copy link
Contributor

atheed commented Jan 30, 2017

Oh, I see, I wasn't aware of that; apologies for the misinformation. In that case, I'm not entirely sure - I too had a look through some of the background shorthand parsing code too, and wasn't able to pinpoint anything there immediately.

@upsuper
Copy link
Contributor Author

upsuper commented Jan 30, 2017

I think I know why. It is because the parser of background-size tries to parse two values, and it returns error when it doesn't accept the second one. However it is perfectly valid to have only one value in the background shorthand for background-size.

So something like left top / auto auto none can be parsed, but left top / auto none cannot, despite that the latter is also valid.

@atheed
Copy link
Contributor

atheed commented Jan 30, 2017

Hmm, I think you're right. Running a quick check, left top / auto auto none parses correctly, while left top / auto none does not (while both parse correctly on the major browsers; I must've made a typo the last time I tested the latter).
Looking at

let height;
if let Ok(value) = input.try(|input| {
match input.next() {
Err(_) => Ok(specified::LengthOrPercentageOrAuto::Auto),
Ok(_) => Err(()),
}
}) {
height = value
} else {
height = try!(specified::LengthOrPercentageOrAuto::parse_non_negative(input));
}
suggests that it is requiring two values to be parsed, though one should be enough/valid too.

@upsuper
Copy link
Contributor Author

upsuper commented Jan 30, 2017

It doesn't require two... but it requires two if there is anything after the first accepted value, which is wrong.

@atheed
Copy link
Contributor

atheed commented Jan 30, 2017

Yup, exactly.

@upsuper
Copy link
Contributor Author

upsuper commented Jan 30, 2017

The same issue also affects mask shorthand (which currently only available with stylo, though).

@jdm
Copy link
Member

jdm commented Feb 14, 2017

@tmccrmck Does this look interesting? It requires creating a unit test in tests/unit/style/parsing/background.rs verifying that parsing the values from the original description works correctly. It then requires modifying the parsing code from this comment to make the test pass. The tests can be run with ./mach test-unit -p style.

@tmccrmck
Copy link

@jdm Yep! I'll reach out on IRC if I have any questions.

@jdm jdm added the C-assigned There is someone working on resolving the issue label Feb 14, 2017
@jdm
Copy link
Member

jdm commented Mar 16, 2017

@tmccrmck Did you make any progress?

@tmccrmck
Copy link

@jdm Ah sorry, no. I haven't been able to compile Servo with my machine. The issue here. You should go ahead and unassign me.

@KiChjang
Copy link
Contributor

I don't ever recall Servo builds requiring bindgen...?

@nox nox self-assigned this Apr 18, 2017
nox added a commit to nox/servo that referenced this issue Apr 18, 2017
bors-servo pushed a commit that referenced this issue Apr 18, 2017
Properly parse background-size in background longhand (fixes #15199)

<!-- Reviewable:start -->
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/16513)
<!-- Reviewable:end -->
nox added a commit to nox/servo that referenced this issue Apr 18, 2017
bors-servo pushed a commit that referenced this issue Apr 18, 2017
Properly parse background-size in background longhand (fixes #15199)

<!-- Reviewable:start -->
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/16513)
<!-- Reviewable:end -->
bors-servo pushed a commit that referenced this issue Apr 20, 2017
Properly parse background-size in background longhand (fixes #15199)

<!-- Reviewable:start -->
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/16513)
<!-- Reviewable:end -->
sadmansk pushed a commit to sadmansk/servo that referenced this issue May 8, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
A-content/css Interacting with CSS from web content (parsing, serializing, introspection) C-assigned There is someone working on resolving the issue
Projects
None yet
Development

No branches or pull requests

6 participants