Avoid `Window::GetComputedStyle` when checking for `display: none`

[jonleighton]

This can be done after #19881 is merged. See @emilio's comment:

I'm pretty sure we can use this to simplify and make stuff faster in canvasrenderingcontext2d.rs, and script_thread.rs, which right now call directly GetComputedStyle.

Those two files both contain calls to GetComputedStyle to check for display: none on an element. We can refactor them to use Node::style() instead.

[emilio]

(Or Element::has_css_layout_box, which is what they really want. They're both bogus, I think)

[highfive]

Hi! If you have any questions regarding this issue, feel free to make a comment here, or ask it in the #servo channel in IRC.

If you intend to work on this issue, then add @highfive: assign me to your comment, and I'll assign this to you. 😄

[emilio]

Well, let me know if you want to take that before marking it as E-easy :).

[jonleighton]

I think leaving as E-easy is fine for now, could be a good first issue for someone :)

[highfive]

Hi! If you have any questions regarding this issue, feel free to make a comment here, or ask it in the #servo channel in IRC.

If you intend to work on this issue, then add @highfive: assign me to your comment, and I'll assign this to you. 😄

[emilio]

I think leaving as E-easy is fine for now, could be a good first issue for someone :)

Sounds great!

[alexfjw]

@highfive assign me

[highfive]

Hey @alexfjw! Thanks for your interest in working on this issue. It's now assigned to you!

[tigercosmos]

@alexfjw I reply your letter here. (More clear to show code)

ComputedValue is trying to implement computed value in CSS. See https://developer.mozilla.org/zh-TW/docs/Web/CSS/computed_value
The detail reference is https://doc.servo.org/style/properties/struct.ComputedValues.html

GetComputedStyle's definition is

servo/components/script/dom/window.rs

Lines 826 to 843 in 2a46067

	fn GetComputedStyle(&self,
	element: &Element,
	pseudo: Option<DOMString>) -> DomRoot<CSSStyleDeclaration> {
	// Steps 1-4.
	let pseudo = match pseudo.map(|mut s| { s.make_ascii_lowercase(); s }) {
	Some(ref pseudo) if pseudo == ":before" || pseudo == "::before" =>
	Some(PseudoElement::Before),
	Some(ref pseudo) if pseudo == ":after" || pseudo == "::after" =>
	Some(PseudoElement::After),
	_ => None
	};
	// Step 5.
	CSSStyleDeclaration::new(self,
	CSSStyleOwner::Element(Dom::from_ref(element)),
	pseudo,
	CSSModificationAccess::Readonly)
	}

P.S. When I encounter the new functions, I will search it for other examples like this

If you still not know how to do, I will suggest you to ping @jonleighton or @emilio. I thought they are nice to help you. Don't be shy to ask (I ask stupid questions all the time :P)