Bug 100332 - [ShadowDOM]: Styles in shadow element presents in document.styleSheets collection
Summary: [ShadowDOM]: Styles in shadow element presents in document.styleSheets collec...
Status: RESOLVED CONFIGURATION CHANGED
Alias: None
Product: WebKit
Classification: Unclassified
Component: DOM (show other bugs)
Version: 528+ (Nightly build)
Hardware: PC Windows 7
: P2 Normal
Assignee: Web Components Team
URL:
Keywords:
: 105274 (view as bug list)
Depends on:
Blocks: 63606 103230
  Show dependency tree / graph
 
Reported: 2012-10-24 23:04 PDT by Sergey G. Grekhov
Modified: 2019-10-04 22:21 PDT (History)
6 users (show)

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Sergey G. Grekhov 2012-10-24 23:04:24 PDT 
Found in Chrome 22.0.1229.94 m

According Shadow DOM spacification styles added to the shadow element shouldn't be exposed via document.styleSheet collection (http://www.w3.org/TR/shadow-dom/#upper-boundary-encapsulation) but in fact these styles are visible. The following test fails:

var SR = window.ShadowRoot ||
         window.WebKitShadowRoot;

	var iframe = document.createElement('iframe');
	iframe.src = 'resources/blank.html';
	document.body.appendChild(iframe);
	iframe.onload = function () {
		try {
			var d = iframe.contentDocument;
			var s = new SR(d.head);
			var style = d.createElement('style');
			s.appendChild(style);
			assert_equals(d.styleSheets.length, 0,
			         'style elements in shadow DOM must not be exposed via ' +
			         'the document.styleSheets collection');			
		} finally {
			iframe.parentNode.removeChild(iframe);
		}
	};

blank.html in the test above is the simple page with the following HTML:

<!DOCTYPE html>
<html>
<head></head>
<body></body>
</html>


Please note that the similar tests for links (instead of style link to the css file is being created) works well. Exact code is:

			var link = d.createElement('link');
			link.setAttribute('rel', 'stylesheet');
			link.setAttribute('href', 'testharness.css');
			s.appendChild(link);

The link from the above is not visible via document.styleSheets collection
Comment 1 Hajime Morrita 2013-03-14 21:59:11 PDT 
*** Bug 105274 has been marked as a duplicate of this bug. ***
Comment 2 Ryosuke Niwa 2019-10-04 22:21:28 PDT 
This has been fixed for v1 API.