| <!doctype html> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| <style> |
| :lang(fr):lang(fr-be):lang(fr) #target1 { |
| color: rgb(1, 2, 3); |
| } |
| :lang(fr):lang(fr-ca) #target2 { |
| color: rgb(4, 5, 6); |
| } |
| :lang(fr-ch):lang(fr) #target3 { |
| color: rgb(7, 8, 9); |
| } |
| </style> |
| </head> |
| <body> |
| <div style="display:none"> |
| <a lang="FR-BE"> |
| <b> |
| <c id="target1"></c> |
| </b> |
| </a> |
| <a lang="FR-CA"> |
| <b> |
| <c id="target2"></c> |
| </b> |
| </a> |
| <a lang="FR-CH"> |
| <b> |
| <c id="target3"></c> |
| </b> |
| </a> |
| </div> |
| </body> |
| <script> |
| description('Verify selector specifying multiple :lang() pseudo class.'); |
| |
| debug("HTML lang only") |
| shouldBe('document.querySelectorAll(":lang(fr):lang(fr-be):lang(fr) #target1").length', '1'); |
| shouldBeEqualToString('getComputedStyle(document.getElementById("target1")).color', 'rgb(1, 2, 3)'); |
| shouldBe('document.querySelectorAll(":lang(fr):lang(fr-ca) #target2").length', '1'); |
| shouldBeEqualToString('getComputedStyle(document.getElementById("target2")).color', 'rgb(4, 5, 6)'); |
| shouldBe('document.querySelectorAll(":lang(fr):lang(fr-ch) #target3").length', '1'); |
| shouldBeEqualToString('getComputedStyle(document.getElementById("target3")).color', 'rgb(7, 8, 9)'); |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </html> |
