Merge pull request #11 from Brightspace/hybridize

Hybridize Dependencies
BrightspaceUI · Jun 19, 2017 · 4426b05 · 4426b05
2 parents d277c76 + 41686c5
commit 4426b05
Show file tree

Hide file tree

Showing 11 changed files with 75 additions and 49 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,4 @@
-bower_components
-node_modules/
+bower_components
+bower_components-1.x
+bower-1.x.json
+node_modules/
diff --git a/bower.json b/bower.json
@@ -10,10 +10,21 @@
     "package.json"
   ],
   "dependencies": {
-    "polymer": "^1.5.0"
+    "polymer": "Polymer/polymer#1.9 - 2.0"
   },
   "devDependencies": {
-    "iron-test-helpers": "PolymerElements/iron-test-helpers#^1.1.5",
-    "web-component-tester": "^4.2.2"
+    "iron-test-helpers": "PolymerElements/iron-test-helpers#1 - 2",
+    "web-component-tester": "^6.0.0"
+  },
+  "variants": {
+	"1.x": {
+	  "dependencies": {
+		"polymer": "Polymer/polymer#^1.9.1"
+	  },
+	  "devDependencies": {
+		"iron-test-helpers": "PolymerElements/iron-test-helpers#^1.4.1",
+		"web-component-tester": "^5.0.0"
+	  }
+	}
   }
 }
diff --git a/d2l-dom.html b/d2l-dom.html
@@ -27,6 +27,8 @@
 
 			if (node.tagName === 'CONTENT') {
 				nodes = node.getDistributedNodes();
+			} else if (node.tagName === 'SLOT') {
+				nodes = node.assignedNodes({flatten: true});
 			} else {
 				if (node.shadowRoot) {
 					node = node.shadowRoot;
@@ -53,6 +55,10 @@
 				}
 			}
 
+			if (node.assignedSlot) {
+				return node.assignedSlot;
+			}
+
 			if (node.parentNode) {
 				return node.parentNode;
 			} else if (node.host) {

diff --git a/demo/dom-focus-demo.html b/demo/dom-focus-demo.html
@@ -0,0 +1,27 @@
+<link rel="import" href="../../polymer/polymer.html">
+
+<dom-module id="d2l-dom-focus-demo">
+	<template>
+		<style>
+			:host {
+				display: block;
+			}
+		</style>
+		<div>
+			<div>
+				<a id="shadow1" href="javascript:void(0);" tabindex="0">Shadow 1</a>
+			</div>
+			<slot></slot>
+			<div>
+				<a id="shadow2" href="javascript:void(0);" tabindex="0">Shadow 2</a>
+			</div>
+		</div>
+	</template>
+	<script>
+		Polymer({
+			is: 'd2l-dom-focus-demo',
+			getShadow1: function() { return this.$.shadow1; },
+			getShadow2: function() { return this.$.shadow2; }
+		});
+	</script>
+</dom-module>
diff --git a/demo/dom-focus.html b/demo/dom-focus.html
@@ -1,7 +1,7 @@
 <html>
 <head>
 	<title>D2L DOM Focus</title>
-	<script src="https://s.brightspace.com/lib/webcomponentsjs/0.7.21/webcomponents.min.js"></script>
+	<script src="../../webcomponentsjs/webcomponents-lite.js"></script>
 	<script>
 		var shadow = (window.location.search.indexOf('dom=shadow') > -1);
 		if (shadow) {
@@ -12,37 +12,12 @@
 	<link rel="stylesheet" href="demo-styles.css">
 	<link rel="import" href="../../polymer/polymer.html">
 	<link rel="import" href="../d2l-dom-focus.html">
+	<link rel="import" href="dom-focus-demo.html">
 	<style>
 	</style>
 </head>
 <body unresolved>
 
-	<dom-module id="d2l-dom-focus-demo">
-		<template>
-			<style>
-				:host {
-					display: block;
-				}
-			</style>
-			<div>
-				<div>
-					<a id="shadow1" href="javascript:void(0);" tabindex="0">Shadow 1</a>
-				</div>
-				<content></content>
-				<div>
-					<a id="shadow2" href="javascript:void(0);" tabindex="0">Shadow 2</a>
-				</div>
-			</div>
-		</template>
-		<script>
-			Polymer({
-				is: 'd2l-dom-focus-demo',
-				getShadow1: function() { return this.$.shadow1; },
-				getShadow2: function() { return this.$.shadow2; }
-			});
-		</script>
-	</dom-module>
-
 	<h1>d2l-dom-focus</h1>
 
 	<h2>focus order</h2>

diff --git a/package.json b/package.json
@@ -3,11 +3,11 @@
   "private": true,
   "description": "Shared Polymer behaviors for use in web components",
   "scripts": {
-    "postinstall": "bower install",
+    "postinstall": "polymer install --variants",
     "test": "npm run test:lint:js && npm run test:lint:wc",
     "test:lint:js": "eslint *.html",
-    "test:lint:wc": "polylint --input *.html",
-    "test:unit:local": "wct --skip-plugin sauce"
+    "test:lint:wc": "polymer lint --input *.html",
+    "test:unit:local": "polymer test --skip-plugin sauce"
   },
   "repository": {
     "type": "git",
@@ -16,11 +16,9 @@
   "author": "D2L Corporation",
   "license": "Apache-2.0",
   "devDependencies": {
-    "bower": "^1.7.7",
-    "eslint": "^2.10.2",
-    "eslint-config-brightspace": "^0.2.1",
-    "eslint-plugin-html": "^1.4.0",
-    "polylint": "^2.10.0",
-    "web-component-tester": "^4.2.2"
+    "eslint": "^3.19.0",
+    "eslint-config-brightspace": "^0.2.4",
+    "eslint-plugin-html": "^3.0.0",
+    "polymer-cli": "^1.2.0"
   }
 }
diff --git a/polymer.json b/polymer.json
@@ -0,0 +1,7 @@
+{
+  "lint": {
+    "rules": [
+      "polymer-2-hybrid"
+    ]
+  }
+}
diff --git a/test/dom-focus.html b/test/dom-focus.html
@@ -18,7 +18,7 @@
 						<a id="shadow1" href="javascript:void(0);"></a>
 					</div>
 					<div id="content">
-						<content></content>
+						<slot></slot>
 					</div>
 					<div>
 						<a id="shadow2" href="javascript:void(0);"></a>

diff --git a/test/dom-visibility.html b/test/dom-visibility.html
@@ -22,7 +22,7 @@
 					}
 				</style>
 				<div class="container">
-					<content></content>
+					<slot></slot>
 				</div>
 			</template>
 			<script>

diff --git a/test/dom.html b/test/dom.html
@@ -14,7 +14,7 @@
 		<dom-module id="d2l-dom-test">
 			<template>
 				<div id="container">
-					<content></content>
+					<slot></slot>
 				</div>
 			</template>
 			<script>
@@ -60,7 +60,7 @@
 		describe('d2l-dom', function() {
 
 			var simpleFixture, wcFixture, mixedFixture;
-			var shadow = (window.location.search.indexOf('dom=shadow') > -1);
+			var shadow = Polymer.Settings.dom === 'shadow' || Polymer.Settings.useShadow;
 
 			beforeEach(function() {
 				simpleFixture = fixture('simpleFixture');
@@ -122,7 +122,7 @@
 					var container = wcFixture.getContainer();
 					var children = D2L.Dom.getComposedChildren(container);
 					if (shadow) {
-						expect(children[0].tagName).to.equal('CONTENT');
+						expect(children[0].tagName).to.be.oneOf(['SLOT', 'CONTENT']);
 						children = D2L.Dom.getComposedChildren(children[0]);
 					}
 					expect(children.length).to.equal(2);

diff --git a/test/index.html b/test/index.html
@@ -9,11 +9,11 @@
 	<body>
 		<script>
 		WCT.loadSuites([
-			'dom.html',
+			'dom.html?wc-shadydom',
 			'dom.html?dom=shadow',
-			'dom-visibility.html',
+			'dom-visibility.html?wc-shadydom',
 			'dom-visibility.html?dom-shadow',
-			'dom-focus.html',
+			'dom-focus.html?wc-shadydom',
 			'dom-focus.html?dom=shadow',
 			'id.html'
 		]);