Convert polygerrit to es6-modules

This change replace all HTML imports with es6-modules. The only exceptions are:
* gr-app.html file, which can be deleted only after updating the
  gerrit/httpd/raw/PolyGerritIndexHtml.soy file.
* dark-theme.html which is loaded via importHref. Must be updated manually
  later in a separate change.

This change was produced automatically by ./es6-modules-converter.sh script.
No manual changes were made.

Change-Id: I0c447dd8c05757741e2c940720652d01d9fb7d67

polygerrit-ui/app/behaviors/async-foreach-behavior/async-foreach-behavior.js

@@ -1,21 +1,19 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<script>
+/**
+ * @license
+ * Copyright (C) 2017 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 (function(window) {
   'use strict';
 
@@ -63,4 +61,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/async-foreach-behavior/async-foreach-behavior_test.html

@@ -19,17 +19,19 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>async-foreach-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<link rel="import" href="async-foreach-behavior.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module" src="./async-foreach-behavior.js"></script>
 
-<script>
-  suite('async-foreach-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './async-foreach-behavior.js';
+suite('async-foreach-behavior tests', () => {
   test('loops over each item', () => {
     const fn = sinon.stub().returns(Promise.resolve());
     return Gerrit.AsyncForeachBehavior.asyncForeach([1, 2, 3], fn)

polygerrit-ui/app/behaviors/base-url-behavior/base-url-behavior.js

@@ -1,21 +1,19 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<script>
+/**
+ * @license
+ * Copyright (C) 2017 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 (function(window) {
   'use strict';
 
@@ -46,4 +44,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/base-url-behavior/base-url-behavior_test.html

@@ -19,17 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>base-url-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './base-url-behavior.js';
 /** @type {string} */
 window.CANONICAL_PATH = '/r';
 </script>
-<link rel="import" href="base-url-behavior.html">
+<script type="module" src="./base-url-behavior.js"></script>
 
 <test-fixture id="basic">
   <template>
@@ -45,9 +48,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('base-url-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './base-url-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('base-url-behavior tests', () => {
   let element;
   // eslint-disable-next-line no-unused-vars
   let overlay;

polygerrit-ui/app/behaviors/docs-url-behavior/docs-url-behavior.js

@@ -1,21 +1,21 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2017 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import '../base-url-behavior/base-url-behavior.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<link rel="import" href="../base-url-behavior/base-url-behavior.html">
-<script>
 (function(window) {
   'use strict';
 
@@ -77,4 +77,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/docs-url-behavior/docs-url-behavior_test.html

@@ -15,17 +15,22 @@ See the License for the specific language governing permissions and
 limitations under the License.
 -->
 <!-- Polymer included for the html import polyfill. -->
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
 <title>docs-url-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<link rel="import" href="docs-url-behavior.html">
+<script type="module" src="./docs-url-behavior.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './docs-url-behavior.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -33,9 +38,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('docs-url-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './docs-url-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('docs-url-behavior tests', () => {
   let element;
 
   suiteSetup(() => {

polygerrit-ui/app/behaviors/dom-util-behavior/dom-util-behavior.js

@@ -1,20 +1,19 @@
-<!--
-@license
-Copyright (C) 2018 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<script>
+/**
+ * @license
+ * Copyright (C) 2018 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 (function(window) {
   'use strict';
 
@@ -61,4 +60,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/dom-util-behavior/dom-util-behavior_test.html

@@ -19,13 +19,13 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>dom-util-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<link rel="import" href="dom-util-behavior.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module" src="./dom-util-behavior.js"></script>
 
 <test-fixture id="nested-structure">
   <template>
@@ -40,9 +40,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('dom-util-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './dom-util-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('dom-util-behavior tests', () => {
   let element;
   let divs;
 

polygerrit-ui/app/behaviors/fire-behavior/fire-behavior.js

@@ -1,21 +1,19 @@
-<!--
-@license
-Copyright (C) 2019 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<script>
+/**
+ * @license
+ * Copyright (C) 2019 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 (function(window) {
   'use strict';
 
@@ -69,4 +67,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/gr-access-behavior/gr-access-behavior.js

@@ -1,21 +1,19 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<script>
+/**
+ * @license
+ * Copyright (C) 2017 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 (function(window) {
   'use strict';
 
@@ -177,4 +175,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/gr-access-behavior/gr-access-behavior_test.html

@@ -19,13 +19,13 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>keyboard-shortcut-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<link rel="import" href="gr-access-behavior.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-access-behavior.js"></script>
 
 <test-fixture id="basic">
   <template>
@@ -33,9 +33,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-access-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './gr-access-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('gr-access-behavior tests', () => {
   let element;
 
   suiteSetup(() => {

polygerrit-ui/app/behaviors/gr-admin-nav-behavior/gr-admin-nav-behavior.js

@@ -1,20 +1,19 @@
-<!--
-@license
-Copyright (C) 2018 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<script>
+/**
+ * @license
+ * Copyright (C) 2018 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 (function(window) {
   'use strict';
 
@@ -220,4 +219,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/gr-admin-nav-behavior/gr-admin-nav-behavior_test.html

@@ -19,13 +19,13 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>keyboard-shortcut-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<link rel="import" href="gr-admin-nav-behavior.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-admin-nav-behavior.js"></script>
 
 <test-fixture id="basic">
   <template>
@@ -33,9 +33,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-admin-nav-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './gr-admin-nav-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('gr-admin-nav-behavior tests', () => {
   let element;
   let sandbox;
   let capabilityStub;

polygerrit-ui/app/behaviors/gr-change-table-behavior/gr-change-table-behavior.js

@@ -1,20 +1,19 @@
-<!--
-@license
-Copyright (C) 2016 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<script>
+/**
+ * @license
+ * Copyright (C) 2016 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 (function(window) {
   'use strict';
 
@@ -105,4 +104,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/gr-change-table-behavior/gr-change-table-behavior_test.html

@@ -19,13 +19,13 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>keyboard-shortcut-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<link rel="import" href="gr-change-table-behavior.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-change-table-behavior.js"></script>
 
 <test-fixture id="basic">
   <template>
@@ -41,9 +41,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-change-table-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './gr-change-table-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('gr-change-table-behavior tests', () => {
   let element;
   // eslint-disable-next-line no-unused-vars
   let overlay;

polygerrit-ui/app/behaviors/gr-display-name-behavior/gr-display-name-behavior.js

@@ -1,23 +1,21 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2017 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import '../../scripts/gr-display-name-utils/gr-display-name-utils.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<script src="../../scripts/gr-display-name-utils/gr-display-name-utils.js"></script>
-
-<script>
 (function(window) {
   'use strict';
 
@@ -57,4 +55,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/gr-display-name-behavior/gr-display-name-behavior_test.html

@@ -19,13 +19,13 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-display-name-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<link rel="import" href="gr-display-name-behavior.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-display-name-behavior.js"></script>
 
 <test-fixture id="basic">
   <template>
@@ -33,9 +33,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-display-name-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './gr-display-name-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('gr-display-name-behavior tests', () => {
   let element;
   // eslint-disable-next-line no-unused-vars
   const config = {

polygerrit-ui/app/behaviors/gr-list-view-behavior/gr-list-view-behavior.js

@@ -1,22 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2017 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import '../base-url-behavior/base-url-behavior.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<link rel="import" href="../base-url-behavior/base-url-behavior.html">
-<link rel="import" href="../gr-url-encoding-behavior/gr-url-encoding-behavior.html">
-<script>
+import '../gr-url-encoding-behavior/gr-url-encoding-behavior.js';
 (function(window) {
   'use strict';
 
@@ -80,5 +80,3 @@ limitations under the License.
       };
   }
 })(window);
-
-</script>

polygerrit-ui/app/behaviors/gr-list-view-behavior/gr-list-view-behavior_test.html

@@ -19,13 +19,13 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>keyboard-shortcut-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<link rel="import" href="gr-list-view-behavior.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-list-view-behavior.js"></script>
 
 <test-fixture id="basic">
   <template>
@@ -33,9 +33,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-list-view-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './gr-list-view-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('gr-list-view-behavior tests', () => {
   let element;
   // eslint-disable-next-line no-unused-vars
   let overlay;

polygerrit-ui/app/behaviors/gr-patch-set-behavior/gr-patch-set-behavior.js

@@ -1,20 +1,19 @@
-<!--
-@license
-Copyright (C) 2016 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<script>
+/**
+ * @license
+ * Copyright (C) 2016 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 (function(window) {
   'use strict';
 
@@ -298,4 +297,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/gr-patch-set-behavior/gr-patch-set-behavior_test.html

@@ -15,19 +15,21 @@ See the License for the specific language governing permissions and
 limitations under the License.
 -->
 <!-- Polymer included for the html import polyfill. -->
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
 <title>gr-patch-set-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<link rel="import" href="gr-patch-set-behavior.html">
+<script type="module" src="./gr-patch-set-behavior.js"></script>
 
-<script>
-  suite('gr-patch-set-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './gr-patch-set-behavior.js';
+suite('gr-patch-set-behavior tests', () => {
   test('getRevisionByPatchNum', () => {
     const get = Gerrit.PatchSetBehavior.getRevisionByPatchNum;
     const revisions = [

polygerrit-ui/app/behaviors/gr-path-list-behavior/gr-path-list-behavior.js

@@ -1,21 +1,21 @@
-<!--
-@license
-Copyright (C) 2016 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2016 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import '../../scripts/util.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<script src="../../scripts/util.js"></script>
-<script>
 (function(window) {
   'use strict';
 
@@ -137,4 +137,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/gr-path-list-behavior/gr-path-list-behavior_test.html

@@ -15,19 +15,21 @@ See the License for the specific language governing permissions and
 limitations under the License.
 -->
 <!-- Polymer included for the html import polyfill. -->
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
 <title>gr-path-list-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<link rel="import" href="gr-path-list-behavior.html">
+<script type="module" src="./gr-path-list-behavior.js"></script>
 
-<script>
-  suite('gr-path-list-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './gr-path-list-behavior.js';
+suite('gr-path-list-behavior tests', () => {
   test('special sort', () => {
     const sort = Gerrit.PathListBehavior.specialFilePathCompare;
     const testFiles = [

polygerrit-ui/app/behaviors/gr-repo-plugin-config-behavior/gr-repo-plugin-config-behavior.js

@@ -1,20 +1,19 @@
-<!--
-@license
-Copyright (C) 2019 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<script>
+/**
+ * @license
+ * Copyright (C) 2019 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 (function(window) {
   'use strict';
 
@@ -52,4 +51,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/gr-tooltip-behavior/gr-tooltip-behavior.html

@@ -1,21 +0,0 @@
-<!--
-@license
-Copyright (C) 2016 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="../../elements/shared/gr-tooltip/gr-tooltip.html">
-<script src="../../scripts/rootElement.js"></script>
-
-<script src="gr-tooltip-behavior.js"></script>

polygerrit-ui/app/behaviors/gr-tooltip-behavior/gr-tooltip-behavior.js

@@ -14,6 +14,12 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+import '../../scripts/bundled-polymer.js';
+
+import '../../elements/shared/gr-tooltip/gr-tooltip.js';
+import '../../scripts/rootElement.js';
+import {flush} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+
 (function(window) {
   'use strict';
 
@@ -135,7 +141,7 @@
     _positionTooltip(tooltip) {
       // This flush is needed for tooltips to be positioned correctly in Firefox
       // and Safari.
-      Polymer.dom.flush();
+      flush();
       const rect = this.getBoundingClientRect();
       const boxRect = tooltip.getBoundingClientRect();
       const parentRect = tooltip.parentElement.getBoundingClientRect();

polygerrit-ui/app/behaviors/gr-tooltip-behavior/gr-tooltip-behavior_test.html

@@ -18,15 +18,20 @@ limitations under the License.
 
 <title>tooltip-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<link rel="import" href="gr-tooltip-behavior.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-tooltip-behavior.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './gr-tooltip-behavior.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -34,9 +39,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-tooltip-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './gr-tooltip-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('gr-tooltip-behavior tests', () => {
   let element;
   let sandbox;
 

polygerrit-ui/app/behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.js

@@ -1,20 +1,19 @@
-<!--
-@license
-Copyright (C) 2016 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<script>
+/**
+ * @license
+ * Copyright (C) 2016 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 (function(window) {
   'use strict';
 
@@ -73,4 +72,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior_test.html

@@ -18,15 +18,20 @@ limitations under the License.
 
 <title>gr-url-encoding-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<link rel="import" href="gr-url-encoding-behavior.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-url-encoding-behavior.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './gr-url-encoding-behavior.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -34,9 +39,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-url-encoding-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './gr-url-encoding-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('gr-url-encoding-behavior tests', () => {
   let element;
   let sandbox;
 

polygerrit-ui/app/behaviors/keyboard-shortcut-behavior/keyboard-shortcut-behavior.js

@@ -1,21 +1,20 @@
-<!--
-@license
-Copyright (C) 2016 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<!--
+/**
+ * @license
+ * Copyright (C) 2016 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/*
 
 How to Add a Keyboard Shortcut
 ==============================
@@ -95,12 +94,17 @@ by gr-app, and actually implemented by gr-comment-thread.
 
 NOTE: doc-only shortcuts will not be customizable in the same way that other
 shortcuts are.
--->
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="/bower_components/iron-a11y-keys-behavior/iron-a11y-keys-behavior.html">
-<script src="../../types/polymer-behaviors.js"></script>
+*/
+/*
+  FIXME(polymer-modulizer): the above comments were extracted
+  from HTML and may be out of place here. Review them and
+  then delete this comment!
+*/
+import '../../scripts/bundled-polymer.js';
 
-<script>
+import {IronA11yKeysBehavior} from '@polymer/iron-a11y-keys-behavior/iron-a11y-keys-behavior.js';
+import '../../types/polymer-behaviors.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
 (function(window) {
   'use strict';
 
@@ -307,7 +311,7 @@ shortcuts are.
 
   /** @return {!(Event|PolymerDomApi|PolymerEventApi)} */
   const getKeyboardEvent = function(e) {
-    e = Polymer.dom(e.detail ? e.detail.keyboardEvent : e);
+    e = dom(e.detail ? e.detail.keyboardEvent : e);
     // When e is a keyboardEvent, e.event is not null.
     if (e.event) { e = e.event; }
     return e;
@@ -482,7 +486,7 @@ shortcuts are.
 
   /** @polymerBehavior Gerrit.KeyboardShortcutBehavior*/
   Gerrit.KeyboardShortcutBehavior = [
-    Polymer.IronA11yKeysBehavior,
+    IronA11yKeysBehavior,
     {
       // Exports for convenience. Note: Closure compiler crashes when
       // object-shorthand syntax is used here.
@@ -518,7 +522,7 @@ shortcuts are.
 
       shouldSuppressKeyboardShortcut(e) {
         e = getKeyboardEvent(e);
-        const tagName = Polymer.dom(e).rootTarget.tagName;
+        const tagName = dom(e).rootTarget.tagName;
         if (tagName === 'INPUT' || tagName === 'TEXTAREA' ||
             (e.keyCode === 13 && tagName === 'A')) {
           // Suppress shortcuts if the key is 'enter' and target is an anchor.
@@ -542,7 +546,7 @@ shortcuts are.
       },
 
       getRootTarget(e) {
-        return Polymer.dom(getKeyboardEvent(e)).rootTarget;
+        return dom(getKeyboardEvent(e)).rootTarget;
       },
 
       bindShortcut(shortcut, ...bindings) {
@@ -671,4 +675,3 @@ shortcuts are.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/keyboard-shortcut-behavior/keyboard-shortcut-behavior_test.html

@@ -19,13 +19,13 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>keyboard-shortcut-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<link rel="import" href="keyboard-shortcut-behavior.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module" src="./keyboard-shortcut-behavior.js"></script>
 
 <test-fixture id="basic">
   <template>
@@ -41,9 +41,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('keyboard-shortcut-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './keyboard-shortcut-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('keyboard-shortcut-behavior tests', () => {
   const kb = window.Gerrit.KeyboardShortcutBinder;
 
   let element;

polygerrit-ui/app/behaviors/rest-client-behavior/rest-client-behavior.js

@@ -1,22 +1,22 @@
-<!--
-@license
-Copyright (C) 2016 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2016 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import '../../scripts/bundled-polymer.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="../base-url-behavior/base-url-behavior.html">
-<script>
+import '../base-url-behavior/base-url-behavior.js';
 (function(window) {
   'use strict';
 
@@ -198,4 +198,3 @@ limitations under the License.
       };
   }
 })(window);
-</script>

polygerrit-ui/app/behaviors/rest-client-behavior/rest-client-behavior_test.html

@@ -19,19 +19,23 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>keyboard-shortcut-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import '../base-url-behavior/base-url-behavior.js';
+import './rest-client-behavior.js';
 /** @type {string} */
 window.CANONICAL_PATH = '/r';
 </script>
 
-<link rel="import" href="../base-url-behavior/base-url-behavior.html">
-<link rel="import" href="rest-client-behavior.html">
+<script type="module" src="../base-url-behavior/base-url-behavior.js"></script>
+<script type="module" src="./rest-client-behavior.js"></script>
 
 <test-fixture id="basic">
   <template>
@@ -47,9 +51,13 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('rest-client-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import '../base-url-behavior/base-url-behavior.js';
+import './rest-client-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('rest-client-behavior tests', () => {
   let element;
   // eslint-disable-next-line no-unused-vars
   let overlay;

polygerrit-ui/app/behaviors/safe-types-behavior/safe-types-behavior.js

@@ -1,20 +1,19 @@
-<!--
-@license
-Copyright (C) 2018 The Android Open Source Project
-
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<script>
+/**
+ * @license
+ * Copyright (C) 2018 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 (function(window) {
   'use strict';
 
@@ -74,4 +73,3 @@ limitations under the License.
     throw new Error(`Refused to bind value as ${type}: ${value}`);
   };
 })(window);
-</script>

polygerrit-ui/app/behaviors/safe-types-behavior/safe-types-behavior_test.html

@@ -18,15 +18,20 @@ limitations under the License.
 
 <title>safe-types-behavior</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../test/common-test-setup.html"/>
-<link rel="import" href="safe-types-behavior.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../test/test-pre-setup.js"></script>
+<script type="module" src="../../test/common-test-setup.js"></script>
+<script type="module" src="./safe-types-behavior.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './safe-types-behavior.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -34,9 +39,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-tooltip-behavior tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../test/test-pre-setup.js';
+import '../../test/common-test-setup.js';
+import './safe-types-behavior.js';
+import {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';
+suite('gr-tooltip-behavior tests', () => {
   let element;
   let sandbox;
 

polygerrit-ui/app/elements/admin/gr-access-section/gr-access-section.js

@@ -14,8 +14,24 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../../behaviors/gr-access-behavior/gr-access-behavior.js';
+import '@polymer/iron-input/iron-input.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-button/gr-button.js';
+import '../../shared/gr-icons/gr-icons.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../gr-permission/gr-permission.js';
+import '../../../scripts/util.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {htmlTemplate} from './gr-access-section_html.js';
 
 /**
  * Fired when the section has been modified or removed.
@@ -42,16 +58,18 @@
  * @appliesMixin Gerrit.FireMixin
  * @extends Polymer.Element
  */
-  class GrAccessSection extends Polymer.mixinBehaviors( [
+class GrAccessSection extends mixinBehaviors( [
   Gerrit.AccessBehavior,
   /**
    * Unused in this element, but called by other elements in tests
    * e.g gr-repo-access_test.
    */
   Gerrit.FireBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-access-section'; }
 
   static get properties() {
@@ -233,7 +251,7 @@
   }
 
   editRefInput() {
-      return Polymer.dom(this.root).querySelector(Polymer.Element ?
+    return dom(this.root).querySelector(PolymerElement ?
       'iron-input.editRefInput' :
       'input[is=iron-input].editRefInput');
   }
@@ -301,4 +319,3 @@
 }
 
 customElements.define(GrAccessSection.is, GrAccessSection);
-})();

polygerrit-ui/app/elements/admin/gr-access-section/gr-access-section_html.js

@@ -1,36 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../../behaviors/gr-access-behavior/gr-access-behavior.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-button/gr-button.html">
-<link rel="import" href="../../shared/gr-icons/gr-icons.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../gr-permission/gr-permission.html">
-
-<script src="../../../scripts/util.js"></script>
-
-<dom-module id="gr-access-section">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       :host {
         display: block;
@@ -89,50 +75,23 @@ limitations under the License.
     <style include="gr-form-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
-    <fieldset id="section"
-        class$="gr-form-styles [[_computeSectionClass(editing, canUpload, ownerOf, _editingRef, _deleted)]]">
+    <fieldset id="section" class\$="gr-form-styles [[_computeSectionClass(editing, canUpload, ownerOf, _editingRef, _deleted)]]">
       <div id="mainContainer">
         <div class="header">
           <div class="name">
             <h3>[[_computeSectionName(section.id)]]</h3>
-            <gr-button
-                id="editBtn"
-                link
-                class$="[[_computeEditBtnClass(section.id)]]"
-                on-click="editReference">
+            <gr-button id="editBtn" link="" class\$="[[_computeEditBtnClass(section.id)]]" on-click="editReference">
               <iron-icon id="icon" icon="gr-icons:create"></iron-icon>
             </gr-button>
           </div>
-          <iron-input
-              class="editRefInput"
-              bind-value="{{section.id}}"
-              type="text"
-              on-input="_handleValueChange">
-            <input
-                class="editRefInput"
-                bind-value="{{section.id}}"
-                is="iron-input"
-                type="text"
-                on-input="_handleValueChange">
+          <iron-input class="editRefInput" bind-value="{{section.id}}" type="text" on-input="_handleValueChange">
+            <input class="editRefInput" bind-value="{{section.id}}" is="iron-input" type="text" on-input="_handleValueChange">
           </iron-input>
-          <gr-button
-              link
-              id="deleteBtn"
-              on-click="_handleRemoveReference">Remove</gr-button>
+          <gr-button link="" id="deleteBtn" on-click="_handleRemoveReference">Remove</gr-button>
         </div><!-- end header -->
         <div class="sectionContent">
-          <template
-              is="dom-repeat"
-              items="{{_permissions}}"
-              as="permission">
-            <gr-permission
-                name="[[_computePermissionName(section.id, permission, permissionValues, capabilities)]]"
-                permission="{{permission}}"
-                labels="[[labels]]"
-                section="[[section.id]]"
-                editing="[[editing]]"
-                groups="[[groups]]"
-                on-added-permission-removed="_handleAddedPermissionRemoved">
+          <template is="dom-repeat" items="{{_permissions}}" as="permission">
+            <gr-permission name="[[_computePermissionName(section.id, permission, permissionValues, capabilities)]]" permission="{{permission}}" labels="[[labels]]" section="[[section.id]]" editing="[[editing]]" groups="[[groups]]" on-added-permission-removed="_handleAddedPermissionRemoved">
             </gr-permission>
           </template>
           <div id="addPermission">
@@ -140,29 +99,19 @@ limitations under the License.
             <select id="permissionSelect">
               <!-- called with a third parameter so that permissions update
                   after a new section is added. -->
-              <template
-                  is="dom-repeat"
-                  items="[[_computePermissions(section.id, capabilities, labels, section.value.permissions.*)]]">
+              <template is="dom-repeat" items="[[_computePermissions(section.id, capabilities, labels, section.value.permissions.*)]]">
                 <option value="[[item.value.id]]">[[item.value.name]]</option>
               </template>
             </select>
-            <gr-button
-                link
-                id="addBtn"
-                on-click="_handleAddPermission">Add</gr-button>
+            <gr-button link="" id="addBtn" on-click="_handleAddPermission">Add</gr-button>
           </div>
           <!-- end addPermission -->
         </div><!-- end sectionContent -->
       </div><!-- end mainContainer -->
       <div id="deletedContainer">
         <span>[[_computeSectionName(section.id)]] was deleted</span>
-        <gr-button
-            link
-            id="undoRemoveBtn"
-            on-click="_handleUndoRemove">Undo</gr-button>
+        <gr-button link="" id="undoRemoveBtn" on-click="_handleUndoRemove">Undo</gr-button>
       </div><!-- end deletedContainer -->
     </fieldset>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-access-section.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-access-section/gr-access-section_test.html

@@ -19,16 +19,21 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-access-section</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/page/page.js"></script>
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-access-section.html">
+<script src="/node_modules/page/page.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-access-section.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-access-section.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -36,9 +41,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-access-section tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-access-section.js';
+suite('gr-access-section tests', () => {
   let element;
   let sandbox;
 

polygerrit-ui/app/elements/admin/gr-admin-group-list/gr-admin-group-list.js

@@ -14,20 +14,37 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.js';
+import '../../../styles/gr-table-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../core/gr-navigation/gr-navigation.js';
+import '../../shared/gr-dialog/gr-dialog.js';
+import '../../shared/gr-list-view/gr-list-view.js';
+import '../../shared/gr-overlay/gr-overlay.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../gr-create-group-dialog/gr-create-group-dialog.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-admin-group-list_html.js';
 
 /**
  * @appliesMixin Gerrit.FireMixin
  * @appliesMixin Gerrit.ListViewMixin
  * @extends Polymer.Element
  */
-  class GrAdminGroupList extends Polymer.mixinBehaviors( [
+class GrAdminGroupList extends mixinBehaviors( [
   Gerrit.FireBehavior,
   Gerrit.ListViewBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-admin-group-list'; }
 
   static get properties() {
@@ -165,4 +182,3 @@
 }
 
 customElements.define(GrAdminGroupList.is, GrAdminGroupList);
-})();

polygerrit-ui/app/elements/admin/gr-admin-group-list/gr-admin-group-list_html.js

@@ -1,64 +1,43 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.html">
-<link rel="import" href="../../../styles/gr-table-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../core/gr-navigation/gr-navigation.html">
-<link rel="import" href="../../shared/gr-dialog/gr-dialog.html">
-<link rel="import" href="../../shared/gr-list-view/gr-list-view.html">
-<link rel="import" href="../../shared/gr-overlay/gr-overlay.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../gr-create-group-dialog/gr-create-group-dialog.html">
-
-<dom-module id="gr-admin-group-list">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
     <style include="gr-table-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
-    <gr-list-view
-        create-new="[[_createNewCapability]]"
-        filter="[[_filter]]"
-        items="[[_groups]]"
-        items-per-page="[[_groupsPerPage]]"
-        loading="[[_loading]]"
-        offset="[[_offset]]"
-        on-create-clicked="_handleCreateClicked"
-        path="[[_path]]">
+    <gr-list-view create-new="[[_createNewCapability]]" filter="[[_filter]]" items="[[_groups]]" items-per-page="[[_groupsPerPage]]" loading="[[_loading]]" offset="[[_offset]]" on-create-clicked="_handleCreateClicked" path="[[_path]]">
       <table id="list" class="genericList">
-        <tr class="headerRow">
+        <tbody><tr class="headerRow">
           <th class="name topHeader">Group Name</th>
           <th class="description topHeader">Group Description</th>
           <th class="visibleToAll topHeader">Visible To All</th>
         </tr>
-        <tr id="loading" class$="loadingMsg [[computeLoadingClass(_loading)]]">
+        <tr id="loading" class\$="loadingMsg [[computeLoadingClass(_loading)]]">
           <td>Loading...</td>
         </tr>
-        <tbody class$="[[computeLoadingClass(_loading)]]">
+        </tbody><tbody class\$="[[computeLoadingClass(_loading)]]">
           <template is="dom-repeat" items="[[_shownGroups]]">
             <tr class="table">
               <td class="name">
-                <a href$="[[_computeGroupUrl(item.group_id)]]">[[item.name]]</a>
+                <a href\$="[[_computeGroupUrl(item.group_id)]]">[[item.name]]</a>
               </td>
               <td class="description">[[item.description]]</td>
               <td class="visibleToAll">[[_visibleToAll(item)]]</td>
@@ -67,27 +46,15 @@ limitations under the License.
         </tbody>
       </table>
     </gr-list-view>
-    <gr-overlay id="createOverlay" with-backdrop>
-      <gr-dialog
-          id="createDialog"
-          class="confirmDialog"
-          disabled="[[!_hasNewGroupName]]"
-          confirm-label="Create"
-          confirm-on-enter
-          on-confirm="_handleCreateGroup"
-          on-cancel="_handleCloseCreate">
+    <gr-overlay id="createOverlay" with-backdrop="">
+      <gr-dialog id="createDialog" class="confirmDialog" disabled="[[!_hasNewGroupName]]" confirm-label="Create" confirm-on-enter="" on-confirm="_handleCreateGroup" on-cancel="_handleCloseCreate">
         <div class="header" slot="header">
           Create Group
         </div>
         <div class="main" slot="main">
-          <gr-create-group-dialog
-              has-new-group-name="{{_hasNewGroupName}}"
-              params="[[params]]"
-              id="createNewModal"></gr-create-group-dialog>
+          <gr-create-group-dialog has-new-group-name="{{_hasNewGroupName}}" params="[[params]]" id="createNewModal"></gr-create-group-dialog>
         </div>
       </gr-dialog>
     </gr-overlay>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-admin-group-list.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-admin-group-list/gr-admin-group-list_test.html

@@ -19,18 +19,23 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-admin-group-list</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/page/page.js"></script>
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
+<script src="/node_modules/page/page.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
 
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
 
-<link rel="import" href="gr-admin-group-list.html">
+<script type="module" src="./gr-admin-group-list.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-admin-group-list.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -38,7 +43,10 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-admin-group-list.js';
 let counter = 0;
 const groupGenerator = () => {
   return {
@@ -55,8 +63,7 @@ limitations under the License.
   };
 };
 
-  suite('gr-admin-group-list tests', async () => {
-    await readyToTest();
+suite('gr-admin-group-list tests', () => {
   let element;
   let groups;
   let sandbox;

polygerrit-ui/app/elements/admin/gr-admin-view/gr-admin-view.js

@@ -14,8 +14,36 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/base-url-behavior/base-url-behavior.js';
+import '../../../behaviors/gr-admin-nav-behavior/gr-admin-nav-behavior.js';
+import '../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.js';
+import '../../../styles/gr-menu-page-styles.js';
+import '../../../styles/gr-page-nav-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../core/gr-navigation/gr-navigation.js';
+import '../../shared/gr-dropdown-list/gr-dropdown-list.js';
+import '../../shared/gr-icons/gr-icons.js';
+import '../../shared/gr-js-api-interface/gr-js-api-interface.js';
+import '../../shared/gr-page-nav/gr-page-nav.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../gr-admin-group-list/gr-admin-group-list.js';
+import '../gr-group/gr-group.js';
+import '../gr-group-audit-log/gr-group-audit-log.js';
+import '../gr-group-members/gr-group-members.js';
+import '../gr-plugin-list/gr-plugin-list.js';
+import '../gr-repo/gr-repo.js';
+import '../gr-repo-access/gr-repo-access.js';
+import '../gr-repo-commands/gr-repo-commands.js';
+import '../gr-repo-dashboards/gr-repo-dashboards.js';
+import '../gr-repo-detail-list/gr-repo-detail-list.js';
+import '../gr-repo-list/gr-repo-list.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-admin-view_html.js';
 
 const INTERNAL_GROUP_REGEX = /^[\da-f]{40}$/;
 
@@ -25,13 +53,15 @@
  * @appliesMixin Gerrit.URLEncodingMixin
  * @extends Polymer.Element
  */
-  class GrAdminView extends Polymer.mixinBehaviors( [
+class GrAdminView extends mixinBehaviors( [
   Gerrit.AdminNavBehavior,
   Gerrit.BaseUrlBehavior,
   Gerrit.URLEncodingBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-admin-view'; }
 
   static get properties() {
@@ -291,4 +321,3 @@
 }
 
 customElements.define(GrAdminView.is, GrAdminView);
-})();

polygerrit-ui/app/elements/admin/gr-admin-view/gr-admin-view_html.js

@@ -1,48 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-
-<link rel="import" href="../../../behaviors/base-url-behavior/base-url-behavior.html">
-<link rel="import" href="../../../behaviors/gr-admin-nav-behavior/gr-admin-nav-behavior.html">
-<link rel="import" href="../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.html">
-<link rel="import" href="../../../styles/gr-menu-page-styles.html">
-<link rel="import" href="../../../styles/gr-page-nav-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../core/gr-navigation/gr-navigation.html">
-<link rel="import" href="../../shared/gr-dropdown-list/gr-dropdown-list.html">
-<link rel="import" href="../../shared/gr-icons/gr-icons.html">
-<link rel="import" href="../../shared/gr-js-api-interface/gr-js-api-interface.html">
-<link rel="import" href="../../shared/gr-page-nav/gr-page-nav.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../gr-admin-group-list/gr-admin-group-list.html">
-<link rel="import" href="../gr-group/gr-group.html">
-<link rel="import" href="../gr-group-audit-log/gr-group-audit-log.html">
-<link rel="import" href="../gr-group-members/gr-group-members.html">
-<link rel="import" href="../gr-plugin-list/gr-plugin-list.html">
-<link rel="import" href="../gr-repo/gr-repo.html">
-<link rel="import" href="../gr-repo-access/gr-repo-access.html">
-<link rel="import" href="../gr-repo-commands/gr-repo-commands.html">
-<link rel="import" href="../gr-repo-dashboards/gr-repo-dashboards.html">
-<link rel="import" href="../gr-repo-detail-list/gr-repo-detail-list.html">
-<link rel="import" href="../gr-repo-list/gr-repo-list.html">
-
-<dom-module id="gr-admin-view">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -84,28 +58,24 @@ limitations under the License.
     <gr-page-nav class="navStyles">
       <ul class="sectionContent">
         <template id="adminNav" is="dom-repeat" items="[[_filteredLinks]]">
-          <li class$="sectionTitle [[_computeSelectedClass(item.view, params)]]">
-            <a class="title" href="[[_computeLinkURL(item)]]"
-                  rel="noopener">[[item.name]]</a>
+          <li class\$="sectionTitle [[_computeSelectedClass(item.view, params)]]">
+            <a class="title" href="[[_computeLinkURL(item)]]" rel="noopener">[[item.name]]</a>
           </li>
           <template is="dom-repeat" items="[[item.children]]" as="child">
-            <li class$="[[_computeSelectedClass(child.view, params)]]">
-              <a href$="[[_computeLinkURL(child)]]"
-                  rel="noopener">[[child.name]]</a>
+            <li class\$="[[_computeSelectedClass(child.view, params)]]">
+              <a href\$="[[_computeLinkURL(child)]]" rel="noopener">[[child.name]]</a>
             </li>
           </template>
           <template is="dom-if" if="[[item.subsection]]">
             <!--If a section has a subsection, render that.-->
-            <li class$="[[_computeSelectedClass(item.subsection.view, params)]]">
-              <a class="title" href$="[[_computeLinkURL(item.subsection)]]"
-                  rel="noopener">
+            <li class\$="[[_computeSelectedClass(item.subsection.view, params)]]">
+              <a class="title" href\$="[[_computeLinkURL(item.subsection)]]" rel="noopener">
                 [[item.subsection.name]]</a>
             </li>
             <!--Loop through the links in the sub-section.-->
-            <template is="dom-repeat"
-                items="[[item.subsection.children]]" as="child">
-              <li class$="subsectionItem [[_computeSelectedClass(child.view, params, child.detailType)]]">
-                <a href$="[[_computeLinkURL(child)]]">[[child.name]]</a>
+            <template is="dom-repeat" items="[[item.subsection.children]]" as="child">
+              <li class\$="subsectionItem [[_computeSelectedClass(child.view, params, child.detailType)]]">
+                <a href\$="[[_computeLinkURL(child)]]">[[child.name]]</a>
               </li>
             </template>
           </template>
@@ -118,12 +88,7 @@ limitations under the License.
           <span class="breadcrumbText">[[_breadcrumbParentName]]</span>
           <iron-icon icon="gr-icons:chevron-right"></iron-icon>
         </span>
-        <gr-dropdown-list
-            lowercase
-            id="pageSelect"
-            value="[[_computeSelectValue(params)]]"
-            items="[[_subsectionLinks]]"
-            on-value-change="_handleSubsectionChange">
+        <gr-dropdown-list lowercase="" id="pageSelect" value="[[_computeSelectValue(params)]]" items="[[_subsectionLinks]]" on-value-change="_handleSubsectionChange">
         </gr-dropdown-list>
       </section>
     </template>
@@ -150,42 +115,32 @@ limitations under the License.
     </template>
     <template is="dom-if" if="[[_showGroup]]" restamp="true">
       <main class="breadcrumbs">
-        <gr-group
-            group-id="[[params.groupId]]"
-            on-name-changed="_updateGroupName"></gr-group>
+        <gr-group group-id="[[params.groupId]]" on-name-changed="_updateGroupName"></gr-group>
       </main>
     </template>
     <template is="dom-if" if="[[_showGroupMembers]]" restamp="true">
       <main class="breadcrumbs">
-        <gr-group-members
-            group-id="[[params.groupId]]"></gr-group-members>
+        <gr-group-members group-id="[[params.groupId]]"></gr-group-members>
       </main>
     </template>
     <template is="dom-if" if="[[_showRepoDetailList]]" restamp="true">
       <main class="table breadcrumbs">
-        <gr-repo-detail-list
-            params="[[params]]"
-            class="table"></gr-repo-detail-list>
+        <gr-repo-detail-list params="[[params]]" class="table"></gr-repo-detail-list>
       </main>
     </template>
     <template is="dom-if" if="[[_showGroupAuditLog]]" restamp="true">
       <main class="table breadcrumbs">
-        <gr-group-audit-log
-            group-id="[[params.groupId]]"
-            class="table"></gr-group-audit-log>
+        <gr-group-audit-log group-id="[[params.groupId]]" class="table"></gr-group-audit-log>
       </main>
     </template>
     <template is="dom-if" if="[[_showRepoCommands]]" restamp="true">
       <main class="breadcrumbs">
-        <gr-repo-commands
-            repo="[[params.repo]]"></gr-repo-commands>
+        <gr-repo-commands repo="[[params.repo]]"></gr-repo-commands>
       </main>
     </template>
     <template is="dom-if" if="[[_showRepoAccess]]" restamp="true">
       <main class="breadcrumbs">
-        <gr-repo-access
-            path="[[path]]"
-            repo="[[params.repo]]"></gr-repo-access>
+        <gr-repo-access path="[[path]]" repo="[[params.repo]]"></gr-repo-access>
       </main>
     </template>
     <template is="dom-if" if="[[_showRepoDashboards]]" restamp="true">
@@ -195,6 +150,4 @@ limitations under the License.
     </template>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
     <gr-js-api-interface id="jsAPI"></gr-js-api-interface>
-  </template>
-  <script src="gr-admin-view.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-admin-view/gr-admin-view_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-admin-view</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-admin-view.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-admin-view.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-admin-view.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,9 +40,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-admin-view tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-admin-view.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+suite('gr-admin-view tests', () => {
   let element;
   let sandbox;
 
@@ -93,7 +101,7 @@ limitations under the License.
     };
 
     flushAsynchronousOperations();
-      assert.equal(Polymer.dom(element.root).querySelectorAll(
+    assert.equal(dom(element.root).querySelectorAll(
         '.selected').length, 1);
     assert.ok(element.shadowRoot
         .querySelector('gr-repo-list'));
@@ -203,7 +211,7 @@ limitations under the License.
         }));
     element.reload().then(() => {
       flushAsynchronousOperations();
-        assert.equal(Polymer.dom(element.root)
+      assert.equal(dom(element.root)
           .querySelectorAll('.sectionTitle').length, 3);
       assert.equal(element.shadowRoot
           .querySelector('.breadcrumbText').innerText, 'Test Repo');
@@ -622,7 +630,7 @@ limitations under the License.
         element._groupName = 'foo';
         return element.reload().then(() => {
           flushAsynchronousOperations();
-            const subsectionItems = Polymer.dom(element.root)
+          const subsectionItems = dom(element.root)
               .querySelectorAll('.subsectionItem');
           assert.equal(subsectionItems.length, 2);
           assert.isTrue(element._groupIsInternal);
@@ -647,7 +655,7 @@ limitations under the License.
         element._groupName = 'foo';
         return element.reload().then(() => {
           flushAsynchronousOperations();
-            const subsectionItems = Polymer.dom(element.root)
+          const subsectionItems = dom(element.root)
               .querySelectorAll('.subsectionItem');
           assert.equal(subsectionItems.length, 0);
           assert.isFalse(element._groupIsInternal);

polygerrit-ui/app/elements/admin/gr-confirm-delete-item-dialog/gr-confirm-delete-item-dialog.js

@@ -14,8 +14,16 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../shared/gr-dialog/gr-dialog.js';
+import '../../../styles/shared-styles.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-confirm-delete-item-dialog_html.js';
 
 const DETAIL_TYPES = {
   BRANCHES: 'branches',
@@ -27,11 +35,13 @@
  * @appliesMixin Gerrit.FireMixin
  * @extends Polymer.Element
  */
-  class GrConfirmDeleteItemDialog extends Polymer.mixinBehaviors( [
+class GrConfirmDeleteItemDialog extends mixinBehaviors( [
   Gerrit.FireBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-confirm-delete-item-dialog'; }
   /**
    * Fired when the confirm button is pressed.
@@ -77,4 +87,3 @@
 
 customElements.define(GrConfirmDeleteItemDialog.is,
     GrConfirmDeleteItemDialog);
-})();

polygerrit-ui/app/elements/admin/gr-confirm-delete-item-dialog/gr-confirm-delete-item-dialog_html.js

@@ -1,38 +1,29 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../shared/gr-dialog/gr-dialog.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-
-<dom-module id="gr-confirm-delete-item-dialog">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       :host {
         display: block;
         width: 30em;
       }
     </style>
-    <gr-dialog
-        confirm-label="Delete [[_computeItemName(itemType)]]"
-        confirm-on-enter
-        on-confirm="_handleConfirmTap"
-        on-cancel="_handleCancelTap">
+    <gr-dialog confirm-label="Delete [[_computeItemName(itemType)]]" confirm-on-enter="" on-confirm="_handleConfirmTap" on-cancel="_handleCancelTap">
       <div class="header" slot="header">[[_computeItemName(itemType)]] Deletion</div>
       <div class="main" slot="main">
         <label for="branchInput">
@@ -43,6 +34,4 @@ limitations under the License.
         </div>
       </div>
     </gr-dialog>
-  </template>
-  <script src="gr-confirm-delete-item-dialog.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-confirm-delete-item-dialog/gr-confirm-delete-item-dialog_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-confirm-delete-item-dialog</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-confirm-delete-item-dialog.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-confirm-delete-item-dialog.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-confirm-delete-item-dialog.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,9 +40,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-confirm-delete-item-dialog tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-confirm-delete-item-dialog.js';
+suite('gr-confirm-delete-item-dialog tests', () => {
   let element;
   let sandbox;
 

polygerrit-ui/app/elements/admin/gr-create-change-dialog/gr-create-change-dialog.js

@@ -14,8 +14,25 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '@polymer/iron-autogrow-textarea/iron-autogrow-textarea.js';
+
+import '@polymer/iron-input/iron-input.js';
+import '../../../scripts/bundled-polymer.js';
+import '../../../behaviors/base-url-behavior/base-url-behavior.js';
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../core/gr-navigation/gr-navigation.js';
+import '../../shared/gr-autocomplete/gr-autocomplete.js';
+import '../../shared/gr-button/gr-button.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../../shared/gr-select/gr-select.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-create-change-dialog_html.js';
 
 const SUGGESTIONS_LIMIT = 15;
 const REF_PREFIX = 'refs/heads/';
@@ -26,7 +43,7 @@
  * @appliesMixin Gerrit.URLEncodingMixin
  * @extends Polymer.Element
  */
-  class GrCreateChangeDialog extends Polymer.mixinBehaviors( [
+class GrCreateChangeDialog extends mixinBehaviors( [
   Gerrit.BaseUrlBehavior,
   /**
    * Unused in this element, but called by other elements in tests
@@ -34,9 +51,11 @@
    */
   Gerrit.FireBehavior,
   Gerrit.URLEncodingBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-create-change-dialog'; }
 
   static get properties() {
@@ -158,4 +177,3 @@
 }
 
 customElements.define(GrCreateChangeDialog.is, GrCreateChangeDialog);
-})();

polygerrit-ui/app/elements/admin/gr-create-change-dialog/gr-create-change-dialog_html.js

@@ -1,36 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="../../../behaviors/base-url-behavior/base-url-behavior.html">
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../core/gr-navigation/gr-navigation.html">
-<link rel="import" href="../../shared/gr-autocomplete/gr-autocomplete.html">
-<link rel="import" href="../../shared/gr-button/gr-button.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../../shared/gr-select/gr-select.html">
-
-<dom-module id="gr-create-change-dialog">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -53,76 +39,42 @@ limitations under the License.
       }
     </style>
     <div class="gr-form-styles">
-      <section class$="[[_computeBranchClass(baseChange)]]">
+      <section class\$="[[_computeBranchClass(baseChange)]]">
         <span class="title">Select branch for new change</span>
         <span class="value">
-          <gr-autocomplete
-              id="branchInput"
-              text="{{branch}}"
-              query="[[_query]]"
-              placeholder="Destination branch">
+          <gr-autocomplete id="branchInput" text="{{branch}}" query="[[_query]]" placeholder="Destination branch">
           </gr-autocomplete>
         </span>
       </section>
-      <section class$="[[_computeBranchClass(baseChange)]]">
+      <section class\$="[[_computeBranchClass(baseChange)]]">
         <span class="title">Provide base commit sha1 for change</span>
         <span class="value">
-          <iron-input
-              maxlength="40"
-              placeholder="(optional)"
-              bind-value="{{baseCommit}}">
-            <input
-                is="iron-input"
-                id="baseCommitInput"
-                maxlength="40"
-                placeholder="(optional)"
-                bind-value="{{baseCommit}}">
+          <iron-input maxlength="40" placeholder="(optional)" bind-value="{{baseCommit}}">
+            <input is="iron-input" id="baseCommitInput" maxlength="40" placeholder="(optional)" bind-value="{{baseCommit}}">
           </iron-input>
         </span>
       </section>
       <section>
         <span class="title">Enter topic for new change</span>
         <span class="value">
-          <iron-input
-              maxlength="1024"
-              placeholder="(optional)"
-              bind-value="{{topic}}">
-            <input
-                is="iron-input"
-                id="tagNameInput"
-                maxlength="1024"
-                placeholder="(optional)"
-                bind-value="{{topic}}">
+          <iron-input maxlength="1024" placeholder="(optional)" bind-value="{{topic}}">
+            <input is="iron-input" id="tagNameInput" maxlength="1024" placeholder="(optional)" bind-value="{{topic}}">
           </iron-input>
         </span>
       </section>
       <section id="description">
         <span class="title">Description</span>
         <span class="value">
-          <iron-autogrow-textarea
-              id="messageInput"
-              class="message"
-              autocomplete="on"
-              rows="4"
-              max-rows="15"
-              bind-value="{{subject}}"
-              placeholder="Insert the description of the change.">
+          <iron-autogrow-textarea id="messageInput" class="message" autocomplete="on" rows="4" max-rows="15" bind-value="{{subject}}" placeholder="Insert the description of the change.">
           </iron-autogrow-textarea>
         </span>
       </section>
-      <section class$="[[_computePrivateSectionClass(_privateChangesEnabled)]]">
-        <label
-            class="title"
-            for="privateChangeCheckBox">Private change</label>
+      <section class\$="[[_computePrivateSectionClass(_privateChangesEnabled)]]">
+        <label class="title" for="privateChangeCheckBox">Private change</label>
         <span class="value">
-          <input
-              type="checkbox"
-              id="privateChangeCheckBox"
-              checked$="[[_formatBooleanString(privateByDefault)]]">
+          <input type="checkbox" id="privateChangeCheckBox" checked\$="[[_formatBooleanString(privateByDefault)]]">
         </span>
       </section>
     </div>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-create-change-dialog.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-create-change-dialog/gr-create-change-dialog_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-create-change-dialog</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-create-change-dialog.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-create-change-dialog.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-create-change-dialog.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,9 +40,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-create-change-dialog tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-create-change-dialog.js';
+suite('gr-create-change-dialog tests', () => {
   let element;
   let sandbox;
 

polygerrit-ui/app/elements/admin/gr-create-group-dialog/gr-create-group-dialog.js

@@ -14,20 +14,33 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/base-url-behavior/base-url-behavior.js';
+import '../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.js';
+import '@polymer/iron-input/iron-input.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-create-group-dialog_html.js';
 
 /**
  * @appliesMixin Gerrit.BaseUrlMixin
  * @appliesMixin Gerrit.URLEncodingMixin
  * @extends Polymer.Element
  */
-  class GrCreateGroupDialog extends Polymer.mixinBehaviors( [
+class GrCreateGroupDialog extends mixinBehaviors( [
   Gerrit.BaseUrlBehavior,
   Gerrit.URLEncodingBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-create-group-dialog'; }
 
   static get properties() {
@@ -75,4 +88,3 @@
 }
 
 customElements.define(GrCreateGroupDialog.is, GrCreateGroupDialog);
-})();

polygerrit-ui/app/elements/admin/gr-create-group-dialog/gr-create-group-dialog_html.js

@@ -1,31 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-
-<link rel="import" href="../../../behaviors/base-url-behavior/base-url-behavior.html">
-<link rel="import" href="../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-
-<dom-module id="gr-create-group-dialog">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -41,16 +32,11 @@ limitations under the License.
       <div id="form">
         <section>
           <span class="title">Group name</span>
-          <iron-input
-              bind-value="{{_name}}">
-            <input
-                is="iron-input"
-                bind-value="{{_name}}">
+          <iron-input bind-value="{{_name}}">
+            <input is="iron-input" bind-value="{{_name}}">
           </iron-input>
         </section>
       </div>
     </div>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-create-group-dialog.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-create-group-dialog/gr-create-group-dialog_test.html

@@ -19,16 +19,21 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-create-group-dialog</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/page/page.js"></script>
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-create-group-dialog.html">
+<script src="/node_modules/page/page.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-create-group-dialog.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-create-group-dialog.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -36,9 +41,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-create-group-dialog tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-create-group-dialog.js';
+suite('gr-create-group-dialog tests', () => {
   let element;
   let sandbox;
   const GROUP_NAME = 'test-group';

polygerrit-ui/app/elements/admin/gr-create-pointer-dialog/gr-create-pointer-dialog.js

@@ -14,8 +14,21 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/base-url-behavior/base-url-behavior.js';
+import '../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.js';
+import '@polymer/iron-input/iron-input.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-button/gr-button.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../../shared/gr-select/gr-select.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-create-pointer-dialog_html.js';
 
 const DETAIL_TYPES = {
   branches: 'branches',
@@ -27,12 +40,14 @@
  * @appliesMixin Gerrit.URLEncodingMixin
  * @extends Polymer.Element
  */
-  class GrCreatePointerDialog extends Polymer.mixinBehaviors( [
+class GrCreatePointerDialog extends mixinBehaviors( [
   Gerrit.BaseUrlBehavior,
   Gerrit.URLEncodingBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-create-pointer-dialog'; }
 
   static get properties() {
@@ -99,4 +114,3 @@
 }
 
 customElements.define(GrCreatePointerDialog.is, GrCreatePointerDialog);
-})();

polygerrit-ui/app/elements/admin/gr-create-pointer-dialog/gr-create-pointer-dialog_html.js

@@ -1,33 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-
-<link rel="import" href="../../../behaviors/base-url-behavior/base-url-behavior.html">
-<link rel="import" href="../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-button/gr-button.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../../shared/gr-select/gr-select.html">
-
-<dom-module id="gr-create-pointer-dialog">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -49,41 +38,23 @@ limitations under the License.
       <div id="form">
         <section id="itemNameSection">
           <span class="title">[[detailType]] name</span>
-          <iron-input
-              placeholder="[[detailType]] Name"
-              bind-value="{{_itemName}}">
-            <input
-                is="iron-input"
-                placeholder="[[detailType]] Name"
-                bind-value="{{_itemName}}">
+          <iron-input placeholder="[[detailType]] Name" bind-value="{{_itemName}}">
+            <input is="iron-input" placeholder="[[detailType]] Name" bind-value="{{_itemName}}">
           </iron-input>
         </section>
         <section id="itemRevisionSection">
           <span class="title">Initial Revision</span>
-          <iron-input
-              placeholder="Revision (Branch or SHA-1)"
-              bind-value="{{_itemRevision}}">
-            <input
-                is="iron-input"
-                placeholder="Revision (Branch or SHA-1)"
-                bind-value="{{_itemRevision}}">
+          <iron-input placeholder="Revision (Branch or SHA-1)" bind-value="{{_itemRevision}}">
+            <input is="iron-input" placeholder="Revision (Branch or SHA-1)" bind-value="{{_itemRevision}}">
           </iron-input>
         </section>
-        <section id="itemAnnotationSection"
-                 class$="[[_computeHideItemClass(itemDetail)]]">
+        <section id="itemAnnotationSection" class\$="[[_computeHideItemClass(itemDetail)]]">
           <span class="title">Annotation</span>
-          <iron-input
-              placeholder="Annotation (Optional)"
-              bind-value="{{_itemAnnotation}}">
-            <input
-                is="iron-input"
-                placeholder="Annotation (Optional)"
-                bind-value="{{_itemAnnotation}}">
+          <iron-input placeholder="Annotation (Optional)" bind-value="{{_itemAnnotation}}">
+            <input is="iron-input" placeholder="Annotation (Optional)" bind-value="{{_itemAnnotation}}">
           </iron-input>
         </section>
       </div>
     </div>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-create-pointer-dialog.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-create-pointer-dialog/gr-create-pointer-dialog_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-create-pointer-dialog</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-create-pointer-dialog.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-create-pointer-dialog.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-create-pointer-dialog.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,14 +40,17 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-create-pointer-dialog tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-create-pointer-dialog.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+suite('gr-create-pointer-dialog tests', () => {
   let element;
   let sandbox;
 
   const ironInput = function(element) {
-      return Polymer.dom(element).querySelector('iron-input');
+    return dom(element).querySelector('iron-input');
   };
 
   setup(() => {

polygerrit-ui/app/elements/admin/gr-create-repo-dialog/gr-create-repo-dialog.js

@@ -14,20 +14,36 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/base-url-behavior/base-url-behavior.js';
+import '../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.js';
+import '@polymer/iron-input/iron-input.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-autocomplete/gr-autocomplete.js';
+import '../../shared/gr-button/gr-button.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../../shared/gr-select/gr-select.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-create-repo-dialog_html.js';
 
 /**
  * @appliesMixin Gerrit.BaseUrlMixin
  * @appliesMixin Gerrit.URLEncodingMixin
  * @extends Polymer.Element
  */
-  class GrCreateRepoDialog extends Polymer.mixinBehaviors( [
+class GrCreateRepoDialog extends mixinBehaviors( [
   Gerrit.BaseUrlBehavior,
   Gerrit.URLEncodingBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-create-repo-dialog'; }
 
   static get properties() {
@@ -140,4 +156,3 @@
 }
 
 customElements.define(GrCreateRepoDialog.is, GrCreateRepoDialog);
-})();

polygerrit-ui/app/elements/admin/gr-create-repo-dialog/gr-create-repo-dialog_html.js

@@ -1,34 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-
-<link rel="import" href="../../../behaviors/base-url-behavior/base-url-behavior.html">
-<link rel="import" href="../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-autocomplete/gr-autocomplete.html">
-<link rel="import" href="../../shared/gr-button/gr-button.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../../shared/gr-select/gr-select.html">
-
-<dom-module id="gr-create-repo-dialog">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -48,42 +36,28 @@ limitations under the License.
       <div id="form">
         <section>
           <span class="title">Repository name</span>
-          <iron-input autocomplete="on"
-                      bind-value="{{_repoConfig.name}}">
-            <input is="iron-input"
-                   id="repoNameInput"
-                   autocomplete="on"
-                   bind-value="{{_repoConfig.name}}">
+          <iron-input autocomplete="on" bind-value="{{_repoConfig.name}}">
+            <input is="iron-input" id="repoNameInput" autocomplete="on" bind-value="{{_repoConfig.name}}">
           </iron-input>
         </section>
         <section>
           <span class="title">Rights inherit from</span>
           <span class="value">
-            <gr-autocomplete
-                id="rightsInheritFromInput"
-                text="{{_repoConfig.parent}}"
-                query="[[_query]]"
-                placeholder="Optional, defaults to 'All-Projects'">
+            <gr-autocomplete id="rightsInheritFromInput" text="{{_repoConfig.parent}}" query="[[_query]]" placeholder="Optional, defaults to 'All-Projects'">
             </gr-autocomplete>
           </span>
         </section>
         <section>
           <span class="title">Owner</span>
           <span class="value">
-            <gr-autocomplete
-                id="ownerInput"
-                text="{{_repoOwner}}"
-                value="{{_repoOwnerId}}"
-                query="[[_queryGroups]]">
+            <gr-autocomplete id="ownerInput" text="{{_repoOwner}}" value="{{_repoOwnerId}}" query="[[_queryGroups]]">
             </gr-autocomplete>
           </span>
         </section>
         <section>
           <span class="title">Create initial empty commit</span>
           <span class="value">
-            <gr-select
-                id="initialCommit"
-                bind-value="{{_repoConfig.create_empty_commit}}">
+            <gr-select id="initialCommit" bind-value="{{_repoConfig.create_empty_commit}}">
               <select>
                 <option value="false">False</option>
                 <option value="true">True</option>
@@ -94,9 +68,7 @@ limitations under the License.
         <section>
           <span class="title">Only serve as parent for other repositories</span>
           <span class="value">
-            <gr-select
-                id="parentRepo"
-                bind-value="{{_repoConfig.permissions_only}}">
+            <gr-select id="parentRepo" bind-value="{{_repoConfig.permissions_only}}">
               <select>
                 <option value="false">False</option>
                 <option value="true">True</option>
@@ -107,6 +79,4 @@ limitations under the License.
       </div>
     </div>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-create-repo-dialog.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-create-repo-dialog/gr-create-repo-dialog_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-create-repo-dialog</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-create-repo-dialog.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-create-repo-dialog.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-create-repo-dialog.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,9 +40,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-create-repo-dialog tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-create-repo-dialog.js';
+suite('gr-create-repo-dialog tests', () => {
   let element;
   let sandbox;
 

polygerrit-ui/app/elements/admin/gr-group-audit-log/gr-group-audit-log.js

@@ -14,8 +14,21 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.js';
+
+import '../../../scripts/bundled-polymer.js';
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../../styles/gr-table-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../core/gr-navigation/gr-navigation.js';
+import '../../shared/gr-date-formatter/gr-date-formatter.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../../shared/gr-account-link/gr-account-link.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-group-audit-log_html.js';
 
 const GROUP_EVENTS = ['ADD_GROUP', 'REMOVE_GROUP'];
 
@@ -24,12 +37,14 @@
  * @appliesMixin Gerrit.ListViewMixin
  * @extends Polymer.Element
  */
-  class GrGroupAuditLog extends Polymer.mixinBehaviors( [
+class GrGroupAuditLog extends mixinBehaviors( [
   Gerrit.FireBehavior,
   Gerrit.ListViewBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-group-audit-log'; }
 
   static get properties() {
@@ -123,4 +138,3 @@
 }
 
 customElements.define(GrGroupAuditLog.is, GrGroupAuditLog);
-})();

polygerrit-ui/app/elements/admin/gr-group-audit-log/gr-group-audit-log_html.js

@@ -1,32 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.html">
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../../styles/gr-table-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../core/gr-navigation/gr-navigation.html">
-<link rel="import" href="../../shared/gr-date-formatter/gr-date-formatter.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../../shared/gr-account-link/gr-account-link.html">
-
-<dom-module id="gr-group-audit-log">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -38,28 +28,26 @@ limitations under the License.
       }
     </style>
     <table id="list" class="genericList">
-      <tr class="headerRow">
+      <tbody><tr class="headerRow">
         <th class="date topHeader">Date</th>
         <th class="type topHeader">Type</th>
         <th class="member topHeader">Member</th>
         <th class="by-user topHeader">By User</th>
       </tr>
-      <tr id="loading" class$="loadingMsg [[computeLoadingClass(_loading)]]">
+      <tr id="loading" class\$="loadingMsg [[computeLoadingClass(_loading)]]">
         <td>Loading...</td>
       </tr>
-      <tbody class$="[[computeLoadingClass(_loading)]]">
+      </tbody><tbody class\$="[[computeLoadingClass(_loading)]]">
         <template is="dom-repeat" items="[[_auditLog]]">
           <tr class="table">
             <td class="date">
-              <gr-date-formatter
-                  has-tooltip
-                  date-str="[[item.date]]">
+              <gr-date-formatter has-tooltip="" date-str="[[item.date]]">
               </gr-date-formatter>
             </td>
             <td class="type">[[itemType(item.type)]]</td>
             <td class="member">
               <template is="dom-if" if="[[_isGroupEvent(item.type)]]">
-                <a href$="[[_computeGroupUrl(item.member)]]">
+                <a href\$="[[_computeGroupUrl(item.member)]]">
                   [[_getNameForGroup(item.member)]]
                 </a>
               </template>
@@ -77,6 +65,4 @@ limitations under the License.
       </tbody>
     </table>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-group-audit-log.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-group-audit-log/gr-group-audit-log_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-group-audit-log</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-group-audit-log.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-group-audit-log.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-group-audit-log.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,9 +40,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-group-audit-log tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-group-audit-log.js';
+suite('gr-group-audit-log tests', () => {
   let element;
   let sandbox;
 

polygerrit-ui/app/elements/admin/gr-group-members/gr-group-members.js

@@ -14,8 +14,27 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../behaviors/base-url-behavior/base-url-behavior.js';
+
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.js';
+import '../../../scripts/bundled-polymer.js';
+import '@polymer/iron-autogrow-textarea/iron-autogrow-textarea.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/gr-subpage-styles.js';
+import '../../../styles/gr-table-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-account-link/gr-account-link.js';
+import '../../shared/gr-autocomplete/gr-autocomplete.js';
+import '../../shared/gr-button/gr-button.js';
+import '../../shared/gr-overlay/gr-overlay.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../gr-confirm-delete-item-dialog/gr-confirm-delete-item-dialog.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-group-members_html.js';
 
 const SUGGESTIONS_LIMIT = 15;
 const SAVING_ERROR_TEXT = 'Group may not exist, or you may not have '+
@@ -29,13 +48,15 @@
  * @appliesMixin Gerrit.URLEncodingMixin
  * @extends Polymer.Element
  */
-  class GrGroupMembers extends Polymer.mixinBehaviors( [
+class GrGroupMembers extends mixinBehaviors( [
   Gerrit.BaseUrlBehavior,
   Gerrit.FireBehavior,
   Gerrit.URLEncodingBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-group-members'; }
 
   static get properties() {
@@ -290,4 +311,3 @@
 }
 
 customElements.define(GrGroupMembers.is, GrGroupMembers);
-})();

polygerrit-ui/app/elements/admin/gr-group-members/gr-group-members_html.js

@@ -1,38 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="../../../behaviors/base-url-behavior/base-url-behavior.html">
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.html">
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/gr-subpage-styles.html">
-<link rel="import" href="../../../styles/gr-table-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-account-link/gr-account-link.html">
-<link rel="import" href="../../shared/gr-autocomplete/gr-autocomplete.html">
-<link rel="import" href="../../shared/gr-button/gr-button.html">
-<link rel="import" href="../../shared/gr-overlay/gr-overlay.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../gr-confirm-delete-item-dialog/gr-confirm-delete-item-dialog.html">
-
-<dom-module id="gr-group-members">
-  <template>
+export const htmlTemplate = html`
     <style include="gr-form-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -72,37 +56,29 @@ limitations under the License.
         display: none;
       }
     </style>
-    <main class$="gr-form-styles [[_computeHideItemClass(_groupOwner, _isAdmin)]]">
-      <div id="loading" class$="[[_computeLoadingClass(_loading)]]">
+    <main class\$="gr-form-styles [[_computeHideItemClass(_groupOwner, _isAdmin)]]">
+      <div id="loading" class\$="[[_computeLoadingClass(_loading)]]">
         Loading...
       </div>
-      <div id="loadedContent" class$="[[_computeLoadingClass(_loading)]]">
+      <div id="loadedContent" class\$="[[_computeLoadingClass(_loading)]]">
         <h1 id="Title">[[_groupName]]</h1>
         <div id="form">
           <h3 id="members">Members</h3>
           <fieldset>
             <span class="value">
-              <gr-autocomplete
-                  id="groupMemberSearchInput"
-                  text="{{_groupMemberSearchName}}"
-                  value="{{_groupMemberSearchId}}"
-                  query="[[_queryMembers]]"
-                  placeholder="Name Or Email">
+              <gr-autocomplete id="groupMemberSearchInput" text="{{_groupMemberSearchName}}" value="{{_groupMemberSearchId}}" query="[[_queryMembers]]" placeholder="Name Or Email">
               </gr-autocomplete>
             </span>
-            <gr-button
-                id="saveGroupMember"
-                on-click="_handleSavingGroupMember"
-                disabled="[[!_groupMemberSearchId]]">
+            <gr-button id="saveGroupMember" on-click="_handleSavingGroupMember" disabled="[[!_groupMemberSearchId]]">
               Add
             </gr-button>
             <table id="groupMembers">
-              <tr class="headerRow">
+              <tbody><tr class="headerRow">
                 <th class="nameHeader">Name</th>
                 <th class="emailAddressHeader">Email Address</th>
                 <th class="deleteHeader">Delete Member</th>
               </tr>
-              <tbody>
+              </tbody><tbody>
                 <template is="dom-repeat" items="[[_groupMembers]]">
                   <tr>
                     <td class="nameColumn">
@@ -110,9 +86,7 @@ limitations under the License.
                     </td>
                     <td>[[item.email]]</td>
                     <td class="deleteColumn">
-                      <gr-button
-                          class="deleteMembersButton"
-                          on-click="_handleDeleteMember">
+                      <gr-button class="deleteMembersButton" on-click="_handleDeleteMember">
                         Delete
                       </gr-button>
                     </td>
@@ -124,35 +98,26 @@ limitations under the License.
           <h3 id="includedGroups">Included Groups</h3>
           <fieldset>
             <span class="value">
-              <gr-autocomplete
-                  id="includedGroupSearchInput"
-                  text="{{_includedGroupSearchName}}"
-                  value="{{_includedGroupSearchId}}"
-                  query="[[_queryIncludedGroup]]"
-                  placeholder="Group Name">
+              <gr-autocomplete id="includedGroupSearchInput" text="{{_includedGroupSearchName}}" value="{{_includedGroupSearchId}}" query="[[_queryIncludedGroup]]" placeholder="Group Name">
               </gr-autocomplete>
             </span>
-            <gr-button
-                id="saveIncludedGroups"
-                on-click="_handleSavingIncludedGroups"
-                disabled="[[!_includedGroupSearchId]]">
+            <gr-button id="saveIncludedGroups" on-click="_handleSavingIncludedGroups" disabled="[[!_includedGroupSearchId]]">
               Add
             </gr-button>
             <table id="includedGroups">
-              <tr class="headerRow">
+              <tbody><tr class="headerRow">
                 <th class="groupNameHeader">Group Name</th>
                 <th class="descriptionHeader">Description</th>
                 <th class="deleteIncludedHeader">
                   Delete Group
                 </th>
               </tr>
-              <tbody>
+              </tbody><tbody>
                 <template is="dom-repeat" items="[[_includedGroups]]">
                   <tr>
                     <td class="nameColumn">
                       <template is="dom-if" if="[[item.url]]">
-                        <a href$="[[_computeGroupUrl(item.url)]]"
-                            rel="noopener">
+                        <a href\$="[[_computeGroupUrl(item.url)]]" rel="noopener">
                           [[item.name]]
                         </a>
                       </template>
@@ -162,9 +127,7 @@ limitations under the License.
                     </td>
                     <td>[[item.description]]</td>
                     <td class="deleteColumn">
-                      <gr-button
-                          class="deleteIncludedGroupButton"
-                          on-click="_handleDeleteIncludedGroup">
+                      <gr-button class="deleteIncludedGroupButton" on-click="_handleDeleteIncludedGroup">
                         Delete
                       </gr-button>
                     </td>
@@ -176,15 +139,8 @@ limitations under the License.
         </div>
       </div>
     </main>
-    <gr-overlay id="overlay" with-backdrop>
-      <gr-confirm-delete-item-dialog
-          class="confirmDialog"
-          on-confirm="_handleDeleteConfirm"
-          on-cancel="_handleConfirmDialogCancel"
-          item="[[_itemName]]"
-          item-type="[[_itemType]]"></gr-confirm-delete-item-dialog>
+    <gr-overlay id="overlay" with-backdrop="">
+      <gr-confirm-delete-item-dialog class="confirmDialog" on-confirm="_handleDeleteConfirm" on-cancel="_handleConfirmDialogCancel" item="[[_itemName]]" item-type="[[_itemType]]"></gr-confirm-delete-item-dialog>
     </gr-overlay>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-group-members.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-group-members/gr-group-members_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-group-members</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-group-members.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-group-members.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-group-members.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,9 +40,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-group-members tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-group-members.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+suite('gr-group-members tests', () => {
   let element;
   let sandbox;
   let groups;
@@ -168,12 +176,12 @@ limitations under the License.
 
   test('_includedGroups', () => {
     assert.equal(element._includedGroups.length, 3);
-      assert.equal(Polymer.dom(element.root)
+    assert.equal(dom(element.root)
         .querySelectorAll('.nameColumn a')[0].href, includedGroups[0].url);
-      assert.equal(Polymer.dom(element.root)
+    assert.equal(dom(element.root)
         .querySelectorAll('.nameColumn a')[1].href,
     'https://test/site/group/url');
-      assert.equal(Polymer.dom(element.root)
+    assert.equal(dom(element.root)
         .querySelectorAll('.nameColumn a')[2].href,
     'https://test/site/group/url');
   });
@@ -304,7 +312,7 @@ limitations under the License.
   });
 
   test('delete member', () => {
-      const deletelBtns = Polymer.dom(element.root)
+    const deletelBtns = dom(element.root)
         .querySelectorAll('.deleteMembersButton');
     MockInteractions.tap(deletelBtns[0]);
     assert.equal(element._itemId, '1000097');
@@ -321,7 +329,7 @@ limitations under the License.
   });
 
   test('delete included groups', () => {
-      const deletelBtns = Polymer.dom(element.root)
+    const deletelBtns = dom(element.root)
         .querySelectorAll('.deleteIncludedGroupButton');
     MockInteractions.tap(deletelBtns[0]);
     assert.equal(element._itemId, 'testId');

polygerrit-ui/app/elements/admin/gr-group/gr-group.js

@@ -14,8 +14,22 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+
+import '../../../scripts/bundled-polymer.js';
+import '@polymer/iron-autogrow-textarea/iron-autogrow-textarea.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/gr-subpage-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-autocomplete/gr-autocomplete.js';
+import '../../shared/gr-copy-clipboard/gr-copy-clipboard.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../../shared/gr-select/gr-select.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-group_html.js';
 
 const INTERNAL_GROUP_REGEX = /^[\da-f]{40}$/;
 
@@ -34,11 +48,13 @@
  * @appliesMixin Gerrit.FireMixin
  * @extends Polymer.Element
  */
-  class GrGroup extends Polymer.mixinBehaviors( [
+class GrGroup extends mixinBehaviors( [
   Gerrit.FireBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-group'; }
   /**
    * Fired when the group name changes.
@@ -248,4 +264,3 @@
 }
 
 customElements.define(GrGroup.is, GrGroup);
-})();

polygerrit-ui/app/elements/admin/gr-group/gr-group_html.js

@@ -1,33 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/gr-subpage-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-autocomplete/gr-autocomplete.html">
-<link rel="import" href="../../shared/gr-copy-clipboard/gr-copy-clipboard.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../../shared/gr-select/gr-select.html">
-
-<dom-module id="gr-group">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -44,77 +33,57 @@ limitations under the License.
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
     <main class="gr-form-styles read-only">
-      <div id="loading" class$="[[_computeLoadingClass(_loading)]]">
+      <div id="loading" class\$="[[_computeLoadingClass(_loading)]]">
         Loading...
       </div>
-      <div id="loadedContent" class$="[[_computeLoadingClass(_loading)]]">
+      <div id="loadedContent" class\$="[[_computeLoadingClass(_loading)]]">
         <h1 id="Title">[[_groupName]]</h1>
         <h2 id="configurations">General</h2>
         <div id="form">
           <fieldset>
             <h3 id="groupUUID">Group UUID</h3>
             <fieldset>
-              <gr-copy-clipboard
-                  text="[[groupId]]"></gr-copy-clipboard>
+              <gr-copy-clipboard text="[[groupId]]"></gr-copy-clipboard>
             </fieldset>
-            <h3 id="groupName" class$="[[_computeHeaderClass(_rename)]]">
+            <h3 id="groupName" class\$="[[_computeHeaderClass(_rename)]]">
               Group Name
             </h3>
             <fieldset>
               <span class="value">
-                <gr-autocomplete
-                    id="groupNameInput"
-                    text="{{_groupConfig.name}}"
-                    disabled="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]"></gr-autocomplete>
+                <gr-autocomplete id="groupNameInput" text="{{_groupConfig.name}}" disabled="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]"></gr-autocomplete>
               </span>
-              <span class="value" disabled$="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
-                <gr-button
-                    id="inputUpdateNameBtn"
-                    on-click="_handleSaveName"
-                    disabled="[[!_rename]]">
+              <span class="value" disabled\$="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
+                <gr-button id="inputUpdateNameBtn" on-click="_handleSaveName" disabled="[[!_rename]]">
                   Rename Group</gr-button>
               </span>
             </fieldset>
-            <h3 class$="[[_computeHeaderClass(_owner)]]">
+            <h3 class\$="[[_computeHeaderClass(_owner)]]">
               Owners
             </h3>
             <fieldset>
               <span class="value">
-                <gr-autocomplete
-                    id="groupOwnerInput"
-                    text="{{_groupConfig.owner}}"
-                    value="{{_groupConfigOwner}}"
-                    query="[[_query]]"
-                    disabled="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
+                <gr-autocomplete id="groupOwnerInput" text="{{_groupConfig.owner}}" value="{{_groupConfigOwner}}" query="[[_query]]" disabled="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
                 </gr-autocomplete>
               </span>
-              <span class="value" disabled$="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
-                <gr-button
-                    on-click="_handleSaveOwner"
-                    disabled="[[!_owner]]">
+              <span class="value" disabled\$="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
+                <gr-button on-click="_handleSaveOwner" disabled="[[!_owner]]">
                   Change Owners</gr-button>
               </span>
             </fieldset>
-            <h3 class$="[[_computeHeaderClass(_description)]]">
+            <h3 class\$="[[_computeHeaderClass(_description)]]">
               Description
             </h3>
             <fieldset>
               <div>
-                <iron-autogrow-textarea
-                    class="description"
-                    autocomplete="on"
-                    bind-value="{{_groupConfig.description}}"
-                    disabled="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]"></iron-autogrow-textarea>
+                <iron-autogrow-textarea class="description" autocomplete="on" bind-value="{{_groupConfig.description}}" disabled="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]"></iron-autogrow-textarea>
               </div>
-              <span class="value" disabled$="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
-                <gr-button
-                    on-click="_handleSaveDescription"
-                    disabled="[[!_description]]">
+              <span class="value" disabled\$="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
+                <gr-button on-click="_handleSaveDescription" disabled="[[!_description]]">
                   Save Description
                 </gr-button>
               </span>
             </fieldset>
-            <h3 id="options" class$="[[_computeHeaderClass(_options)]]">
+            <h3 id="options" class\$="[[_computeHeaderClass(_options)]]">
               Group Options
             </h3>
             <fieldset id="visableToAll">
@@ -123,10 +92,8 @@ limitations under the License.
                   Make group visible to all registered users
                 </span>
                 <span class="value">
-                  <gr-select
-                      id="visibleToAll"
-                      bind-value="{{_groupConfig.options.visible_to_all}}">
-                    <select disabled$="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
+                  <gr-select id="visibleToAll" bind-value="{{_groupConfig.options.visible_to_all}}">
+                    <select disabled\$="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
                       <template is="dom-repeat" items="[[_submitTypes]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
@@ -134,10 +101,8 @@ limitations under the License.
                   </gr-select>
                 </span>
               </section>
-              <span class="value" disabled$="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
-                <gr-button
-                    on-click="_handleSaveOptions"
-                    disabled="[[!_options]]">
+              <span class="value" disabled\$="[[_computeGroupDisabled(_groupOwner, _isAdmin, _groupIsInternal)]]">
+                <gr-button on-click="_handleSaveOptions" disabled="[[!_options]]">
                   Save Group Options
                 </gr-button>
               </span>
@@ -147,6 +112,4 @@ limitations under the License.
       </div>
     </main>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-group.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-group/gr-group_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-group</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-group.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-group.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-group.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,9 +40,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-group tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-group.js';
+suite('gr-group tests', () => {
   let element;
   let sandbox;
   let groupStub;

polygerrit-ui/app/elements/admin/gr-permission/gr-permission.js

@@ -14,8 +14,24 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../../behaviors/gr-access-behavior/gr-access-behavior.js';
+import '@polymer/paper-toggle-button/paper-toggle-button.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/gr-menu-page-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-autocomplete/gr-autocomplete.js';
+import '../../shared/gr-button/gr-button.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../gr-rule-editor/gr-rule-editor.js';
+import {flush} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-permission_html.js';
 
 const MAX_AUTOCOMPLETE_RESULTS = 20;
 
@@ -39,16 +55,18 @@
  * @event added-permission-removed
  * @extends Polymer.Element
  */
-  class GrPermission extends Polymer.mixinBehaviors( [
+class GrPermission extends mixinBehaviors( [
   Gerrit.AccessBehavior,
   /**
    * Unused in this element, but called by other elements in tests
    * e.g gr-access-section_test.
    */
   Gerrit.FireBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-permission'; }
 
   static get properties() {
@@ -111,7 +129,7 @@
   _setupValues() {
     if (!this.permission) { return; }
     this._originalExclusiveValue = !!this.permission.value.exclusive;
-      Polymer.dom.flush();
+    flush();
   }
 
   _handleAccessSaved() {
@@ -294,7 +312,7 @@
     // add to permission values as well, so that the change gets propogated
     // back to the section. Since the rule is inside a dom-repeat, a flush
     // is needed.
-      Polymer.dom.flush();
+    flush();
     const value = this._rules[this._rules.length - 1].value;
     value.added = true;
     // See comment above for why we cannot use "this.set(...)" here.
@@ -311,4 +329,3 @@
 }
 
 customElements.define(GrPermission.is, GrPermission);
-})();

polygerrit-ui/app/elements/admin/gr-permission/gr-permission_html.js

@@ -1,34 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../../behaviors/gr-access-behavior/gr-access-behavior.html">
-<link rel="import" href="/bower_components/paper-toggle-button/paper-toggle-button.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/gr-menu-page-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-autocomplete/gr-autocomplete.html">
-<link rel="import" href="../../shared/gr-button/gr-button.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../gr-rule-editor/gr-rule-editor.html">
-
-<dom-module id="gr-permission">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       :host {
         display: block;
@@ -88,49 +76,23 @@ limitations under the License.
     <style include="gr-menu-page-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
-    <section
-        id="permission"
-        class$="gr-form-styles [[_computeSectionClass(editing, _deleted)]]">
+    <section id="permission" class\$="gr-form-styles [[_computeSectionClass(editing, _deleted)]]">
       <div id="mainContainer">
         <div class="header">
           <span class="title">[[name]]</span>
           <div class="right">
-            <template is=dom-if if="[[!_permissionIsOwnerOrGlobal(permission.id, section)]]">
-              <paper-toggle-button
-                  id="exclusiveToggle"
-                  checked="{{permission.value.exclusive}}"
-                  on-change="_handleValueChange"
-                  disabled$="[[!editing]]"></paper-toggle-button>Exclusive
+            <template is="dom-if" if="[[!_permissionIsOwnerOrGlobal(permission.id, section)]]">
+              <paper-toggle-button id="exclusiveToggle" checked="{{permission.value.exclusive}}" on-change="_handleValueChange" disabled\$="[[!editing]]"></paper-toggle-button>Exclusive
             </template>
-            <gr-button
-                link
-                id="removeBtn"
-                on-click="_handleRemovePermission">Remove</gr-button>
+            <gr-button link="" id="removeBtn" on-click="_handleRemovePermission">Remove</gr-button>
           </div>
         </div><!-- end header -->
         <div class="rules">
-          <template
-              is="dom-repeat"
-              items="{{_rules}}"
-              as="rule">
-            <gr-rule-editor
-                has-range="[[_computeHasRange(name)]]"
-                label="[[_label]]"
-                editing="[[editing]]"
-                group-id="[[rule.id]]"
-                group-name="[[_computeGroupName(groups, rule.id)]]"
-                permission="[[permission.id]]"
-                rule="{{rule}}"
-                section="[[section]]"
-                on-added-rule-removed="_handleAddedRuleRemoved"></gr-rule-editor>
+          <template is="dom-repeat" items="{{_rules}}" as="rule">
+            <gr-rule-editor has-range="[[_computeHasRange(name)]]" label="[[_label]]" editing="[[editing]]" group-id="[[rule.id]]" group-name="[[_computeGroupName(groups, rule.id)]]" permission="[[permission.id]]" rule="{{rule}}" section="[[section]]" on-added-rule-removed="_handleAddedRuleRemoved"></gr-rule-editor>
           </template>
           <div id="addRule">
-            <gr-autocomplete
-                id="groupAutocomplete"
-                text="{{_groupFilter}}"
-                query="[[_query]]"
-                placeholder="Add group"
-                on-commit="_handleAddRuleItem">
+            <gr-autocomplete id="groupAutocomplete" text="{{_groupFilter}}" query="[[_query]]" placeholder="Add group" on-commit="_handleAddRuleItem">
             </gr-autocomplete>
           </div>
           <!-- end addRule -->
@@ -138,13 +100,8 @@ limitations under the License.
       </div><!-- end mainContainer -->
       <div id="deletedContainer">
         <span>[[name]] was deleted</span>
-        <gr-button
-            link
-            id="undoRemoveBtn"
-            on-click="_handleUndoRemove">Undo</gr-button>
+        <gr-button link="" id="undoRemoveBtn" on-click="_handleUndoRemove">Undo</gr-button>
       </div><!-- end deletedContainer -->
     </section>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-permission.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-permission/gr-permission_test.html

@@ -19,16 +19,21 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-permission</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/page/page.js"></script>
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-permission.html">
+<script src="/node_modules/page/page.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-permission.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-permission.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -36,9 +41,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-permission tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-permission.js';
+suite('gr-permission tests', () => {
   let element;
   let sandbox;
 

polygerrit-ui/app/elements/admin/gr-plugin-config-array-editor/gr-plugin-config-array-editor.js

@@ -14,13 +14,25 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '@polymer/iron-input/iron-input.js';
+import '@polymer/paper-toggle-button/paper-toggle-button.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-button/gr-button.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-plugin-config-array-editor_html.js';
 
 /** @extends Polymer.Element */
-  class GrPluginConfigArrayEditor extends Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element)) {
+class GrPluginConfigArrayEditor extends GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement)) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-plugin-config-array-editor'; }
   /**
    * Fired when the plugin config option changes.
@@ -71,7 +83,7 @@
   }
 
   _handleDelete(e) {
-      const value = Polymer.dom(e).localTarget.dataset.item;
+    const value = dom(e).localTarget.dataset.item;
     this._dispatchChanged(
         this.pluginOption.info.values.filter(str => str !== value));
   }
@@ -94,4 +106,3 @@
 
 customElements.define(GrPluginConfigArrayEditor.is,
     GrPluginConfigArrayEditor);
-})();

polygerrit-ui/app/elements/admin/gr-plugin-config-array-editor/gr-plugin-config-array-editor_html.js

@@ -1,30 +1,22 @@
-<!--
-@license
-Copyright (C) 2018 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
-<link rel="import" href="/bower_components/paper-toggle-button/paper-toggle-button.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-button/gr-button.html">
-
-<dom-module id="gr-plugin-config-array-editor">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -72,11 +64,7 @@ limitations under the License.
           <template is="dom-repeat" items="[[pluginOption.info.values]]">
             <div class="row">
               <span>[[item]]</span>
-              <gr-button
-                  link
-                  disabled$="[[disabled]]"
-                  data-item$="[[item]]"
-                  on-click="_handleDelete">Delete</gr-button>
+              <gr-button link="" disabled\$="[[disabled]]" data-item\$="[[item]]" on-click="_handleDelete">Delete</gr-button>
             </div>
           </template>
         </div>
@@ -84,23 +72,11 @@ limitations under the License.
       <template is="dom-if" if="[[!pluginOption.info.values.length]]">
         <div class="row placeholder">None configured.</div>
       </template>
-      <div class$="row [[_computeShowInputRow(disabled)]]">
-        <iron-input
-            on-keydown="_handleInputKeydown"
-            bind-value="{{_newValue}}">
-          <input
-              is="iron-input"
-              id="input"
-              on-keydown="_handleInputKeydown"
-              bind-value="{{_newValue}}">
+      <div class\$="row [[_computeShowInputRow(disabled)]]">
+        <iron-input on-keydown="_handleInputKeydown" bind-value="{{_newValue}}">
+          <input is="iron-input" id="input" on-keydown="_handleInputKeydown" bind-value="{{_newValue}}">
         </iron-input>
-        <gr-button
-            id="addButton"
-            disabled$="[[!_newValue.length]]"
-            link
-            on-click="_handleAddTap">Add</gr-button>
+        <gr-button id="addButton" disabled\$="[[!_newValue.length]]" link="" on-click="_handleAddTap">Add</gr-button>
       </div>
     </div>
-  </template>
-  <script src="gr-plugin-config-array-editor.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-plugin-config-array-editor/gr-plugin-config-array-editor_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-plugin-config-array-editor</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-plugin-config-array-editor.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-plugin-config-array-editor.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-plugin-config-array-editor.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,14 +40,17 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-plugin-config-array-editor tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-plugin-config-array-editor.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+suite('gr-plugin-config-array-editor tests', () => {
   let element;
   let sandbox;
   let dispatchStub;
 
-    const getAll = str => Polymer.dom(element.root).querySelectorAll(str);
+  const getAll = str => dom(element.root).querySelectorAll(str);
 
   setup(() => {
     sandbox = sinon.sandbox.create();

polygerrit-ui/app/elements/admin/gr-plugin-list/gr-plugin-list.js

@@ -14,20 +14,33 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.js';
+import '../../../styles/gr-table-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-list-view/gr-list-view.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-plugin-list_html.js';
 
 /**
  * @appliesMixin Gerrit.FireMixin
  * @appliesMixin Gerrit.ListViewMixin
  * @extends Polymer.Element
  */
-  class GrPluginList extends Polymer.mixinBehaviors( [
+class GrPluginList extends mixinBehaviors( [
   Gerrit.FireBehavior,
   Gerrit.ListViewBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-plugin-list'; }
 
   static get properties() {
@@ -120,4 +133,3 @@
 }
 
 customElements.define(GrPluginList.is, GrPluginList);
-})();

polygerrit-ui/app/elements/admin/gr-plugin-list/gr-plugin-list_html.js

@@ -1,58 +1,44 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<link rel="import" href="/bower_components/polymer/polymer.html">
-
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.html">
-<link rel="import" href="../../../styles/gr-table-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-list-view/gr-list-view.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-
-<dom-module id="gr-plugin-list">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
     <style include="gr-table-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
-    <gr-list-view
-        filter="[[_filter]]"
-        items-per-page="[[_pluginsPerPage]]"
-        items="[[_plugins]]"
-        loading="[[_loading]]"
-        offset="[[_offset]]"
-        path="[[_path]]">
+    <gr-list-view filter="[[_filter]]" items-per-page="[[_pluginsPerPage]]" items="[[_plugins]]" loading="[[_loading]]" offset="[[_offset]]" path="[[_path]]">
       <table id="list" class="genericList">
-        <tr class="headerRow">
+        <tbody><tr class="headerRow">
           <th class="name topHeader">Plugin Name</th>
           <th class="version topHeader">Version</th>
           <th class="status topHeader">Status</th>
         </tr>
-        <tr id="loading" class$="loadingMsg [[computeLoadingClass(_loading)]]">
+        <tr id="loading" class\$="loadingMsg [[computeLoadingClass(_loading)]]">
           <td>Loading...</td>
         </tr>
-        <tbody class$="[[computeLoadingClass(_loading)]]">
+        </tbody><tbody class\$="[[computeLoadingClass(_loading)]]">
           <template is="dom-repeat" items="[[_shownPlugins]]">
             <tr class="table">
               <td class="name">
                 <template is="dom-if" if="[[item.index_url]]">
-                  <a href$="[[_computePluginUrl(item.index_url)]]">[[item.id]]</a>
+                  <a href\$="[[_computePluginUrl(item.index_url)]]">[[item.id]]</a>
                 </template>
                 <template is="dom-if" if="[[!item.index_url]]">
                   [[item.id]]
@@ -66,6 +52,4 @@ limitations under the License.
       </table>
     </gr-list-view>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-plugin-list.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-plugin-list/gr-plugin-list_test.html

@@ -19,16 +19,21 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-plugin-list</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/page/page.js"></script>
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-plugin-list.html">
+<script src="/node_modules/page/page.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-plugin-list.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-plugin-list.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -36,7 +41,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-plugin-list.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
 let counter;
 const pluginGenerator = () => {
   const plugin = {
@@ -51,8 +60,7 @@ limitations under the License.
   return plugin;
 };
 
-  suite('gr-plugin-list tests', async () => {
-    await readyToTest();
+suite('gr-plugin-list tests', () => {
   let element;
   let plugins;
   let sandbox;
@@ -93,7 +101,7 @@ limitations under the License.
 
     test('with and without urls', done => {
       flush(() => {
-          const names = Polymer.dom(element.root).querySelectorAll('.name');
+        const names = dom(element.root).querySelectorAll('.name');
         assert.isOk(names[1].querySelector('a'));
         assert.equal(names[1].querySelector('a').innerText, 'test1');
         assert.isNotOk(names[2].querySelector('a'));

polygerrit-ui/app/elements/admin/gr-repo-access/gr-repo-access.js

@@ -14,8 +14,25 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/base-url-behavior/base-url-behavior.js';
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../../behaviors/gr-access-behavior/gr-access-behavior.js';
+import '../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.js';
+import '../../../styles/gr-menu-page-styles.js';
+import '../../../styles/gr-subpage-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../core/gr-navigation/gr-navigation.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../gr-access-section/gr-access-section.js';
+import '../../../scripts/util.js';
+import {flush, dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-repo-access_html.js';
 
 const Defs = {};
 
@@ -74,14 +91,16 @@
  * @appliesMixin Gerrit.URLEncodingMixin
  * @extends Polymer.Element
  */
-  class GrRepoAccess extends Polymer.mixinBehaviors( [
+class GrRepoAccess extends mixinBehaviors( [
   Gerrit.AccessBehavior,
   Gerrit.BaseUrlBehavior,
   Gerrit.FireBehavior,
   Gerrit.URLEncodingBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-repo-access'; }
 
   static get properties() {
@@ -414,8 +433,8 @@
     const section = {permissions: {}, added: true};
     this.push('_sections', {id: newRef, value: section});
     this.set(['_local', newRef], section);
-      Polymer.dom.flush();
-      Polymer.dom(this.root).querySelector('gr-access-section:last-of-type')
+    flush();
+    dom(this.root).querySelector('gr-access-section:last-of-type')
         .editReference();
   }
 
@@ -507,4 +526,3 @@
 }
 
 customElements.define(GrRepoAccess.is, GrRepoAccess);
-})();

polygerrit-ui/app/elements/admin/gr-repo-access/gr-repo-access_html.js

@@ -1,38 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-
-<link rel="import" href="../../../behaviors/base-url-behavior/base-url-behavior.html">
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../../behaviors/gr-access-behavior/gr-access-behavior.html">
-<link rel="import" href="../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.html">
-
-<link rel="import" href="../../../styles/gr-menu-page-styles.html">
-<link rel="import" href="../../../styles/gr-subpage-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../core/gr-navigation/gr-navigation.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../gr-access-section/gr-access-section.html">
-
-<script src="../../../scripts/util.js"></script>
-
-<dom-module id="gr-repo-access">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -73,25 +57,18 @@ limitations under the License.
     <style include="gr-menu-page-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
-    <main class$="[[_computeMainClass(_ownerOf, _canUpload, _editing)]]">
-      <div id="loading" class$="[[_computeLoadingClass(_loading)]]">
+    <main class\$="[[_computeMainClass(_ownerOf, _canUpload, _editing)]]">
+      <div id="loading" class\$="[[_computeLoadingClass(_loading)]]">
         Loading...
       </div>
-      <div id="loadedContent" class$="[[_computeLoadingClass(_loading)]]">
-        <h3 id="inheritsFrom" class$="[[_computeShowInherit(_inheritsFrom)]]">
+      <div id="loadedContent" class\$="[[_computeLoadingClass(_loading)]]">
+        <h3 id="inheritsFrom" class\$="[[_computeShowInherit(_inheritsFrom)]]">
           <span class="rightsText">Rights Inherit From</span>
-          <a
-              href$="[[_computeParentHref(_inheritsFrom.name)]]"
-              rel="noopener"
-              id="inheritFromName">
+          <a href\$="[[_computeParentHref(_inheritsFrom.name)]]" rel="noopener" id="inheritFromName">
             [[_inheritsFrom.name]]</a>
-          <gr-autocomplete
-              id="editInheritFromInput"
-              text="{{_inheritFromFilter}}"
-              query="[[_query]]"
-              on-commit="_handleUpdateInheritFrom"></gr-autocomplete>
+          <gr-autocomplete id="editInheritFromInput" text="{{_inheritFromFilter}}" query="[[_query]]" on-commit="_handleUpdateInheritFrom"></gr-autocomplete>
         </h3>
-        <div class$="weblinks [[_computeWebLinkClass(_weblinks)]]">
+        <div class\$="weblinks [[_computeWebLinkClass(_weblinks)]]">
           History:
           <template is="dom-repeat" items="[[_weblinks]]" as="link">
             <a href="[[link.url]]" class="weblink" rel="noopener" target="[[link.target]]">
@@ -99,41 +76,16 @@ limitations under the License.
             </a>
           </template>
         </div>
-        <gr-button id="editBtn"
-            on-click="_handleEdit">[[_editOrCancel(_editing)]]</gr-button>
-        <gr-button id="saveBtn"
-            primary
-            class$="[[_computeSaveBtnClass(_ownerOf)]]"
-            on-click="_handleSave"
-            disabled="[[!_modified]]">Save</gr-button>
-        <gr-button id="saveReviewBtn"
-            primary
-            class$="[[_computeSaveReviewBtnClass(_canUpload)]]"
-            on-click="_handleSaveForReview"
-            disabled="[[!_modified]]">Save for review</gr-button>
-        <template
-            is="dom-repeat"
-            items="{{_sections}}"
-            initial-count="5"
-            target-framerate="60"
-            as="section">
-          <gr-access-section
-              capabilities="[[_capabilities]]"
-              section="{{section}}"
-              labels="[[_labels]]"
-              can-upload="[[_canUpload]]"
-              editing="[[_editing]]"
-              owner-of="[[_ownerOf]]"
-              groups="[[_groups]]"
-              on-added-section-removed="_handleAddedSectionRemoved"></gr-access-section>
+        <gr-button id="editBtn" on-click="_handleEdit">[[_editOrCancel(_editing)]]</gr-button>
+        <gr-button id="saveBtn" primary="" class\$="[[_computeSaveBtnClass(_ownerOf)]]" on-click="_handleSave" disabled="[[!_modified]]">Save</gr-button>
+        <gr-button id="saveReviewBtn" primary="" class\$="[[_computeSaveReviewBtnClass(_canUpload)]]" on-click="_handleSaveForReview" disabled="[[!_modified]]">Save for review</gr-button>
+        <template is="dom-repeat" items="{{_sections}}" initial-count="5" target-framerate="60" as="section">
+          <gr-access-section capabilities="[[_capabilities]]" section="{{section}}" labels="[[_labels]]" can-upload="[[_canUpload]]" editing="[[_editing]]" owner-of="[[_ownerOf]]" groups="[[_groups]]" on-added-section-removed="_handleAddedSectionRemoved"></gr-access-section>
         </template>
         <div class="referenceContainer">
-          <gr-button id="addReferenceBtn"
-              on-click="_handleCreateSection">Add Reference</gr-button>
+          <gr-button id="addReferenceBtn" on-click="_handleCreateSection">Add Reference</gr-button>
         </div>
       </div>
     </main>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-repo-access.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-repo-access/gr-repo-access_test.html

@@ -19,16 +19,21 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-repo-access</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/page/page.js"></script>
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-repo-access.html">
+<script src="/node_modules/page/page.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-repo-access.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-access.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -36,9 +41,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-repo-access tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-access.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+suite('gr-repo-access tests', () => {
   let element;
   let sandbox;
   let repoStub;
@@ -684,7 +692,7 @@ limitations under the License.
         remove: {},
       };
       const newPermission =
-            Polymer.dom(element.shadowRoot
+          dom(element.shadowRoot
               .querySelector('gr-access-section').root).querySelectorAll(
               'gr-permission')[2];
       newPermission._handleAddRuleItem(
@@ -776,7 +784,7 @@ limitations under the License.
         },
         remove: {},
       };
-        const newSection = Polymer.dom(element.root)
+      const newSection = dom(element.root)
           .querySelectorAll('gr-access-section')[1];
       newSection._handleAddPermission();
       flushAsynchronousOperations();
@@ -919,7 +927,7 @@ limitations under the License.
 
       // Add a rule to the existing permission;
       const readPermission =
-            Polymer.dom(element.shadowRoot
+          dom(element.shadowRoot
               .querySelector('gr-access-section').root).querySelectorAll(
               'gr-permission')[1];
       readPermission._handleAddRuleItem(
@@ -993,7 +1001,7 @@ limitations under the License.
 
       // Add a new section.
       MockInteractions.tap(element.$.addReferenceBtn);
-        let newSection = Polymer.dom(element.root)
+      let newSection = dom(element.root)
           .querySelectorAll('gr-access-section')[1];
       newSection._handleAddPermission();
       flushAsynchronousOperations();
@@ -1067,7 +1075,7 @@ limitations under the License.
 
       // Add a second new section.
       MockInteractions.tap(element.$.addReferenceBtn);
-        newSection = Polymer.dom(element.root)
+      newSection = dom(element.root)
           .querySelectorAll('gr-access-section')[2];
       newSection._handleAddPermission();
       flushAsynchronousOperations();

polygerrit-ui/app/elements/admin/gr-repo-command/gr-repo-command.js

@@ -14,13 +14,21 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-button/gr-button.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-repo-command_html.js';
 
 /** @extends Polymer.Element */
-  class GrRepoCommand extends Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element)) {
+class GrRepoCommand extends GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement)) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-repo-command'; }
 
   static get properties() {
@@ -44,4 +52,3 @@
 }
 
 customElements.define(GrRepoCommand.is, GrRepoCommand);
-})();

polygerrit-ui/app/elements/admin/gr-repo-command/gr-repo-command_html.js

@@ -1,25 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-button/gr-button.html">
-
-<dom-module id="gr-repo-command">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       :host {
         display: block;
@@ -27,13 +24,7 @@ limitations under the License.
       }
     </style>
     <h3>[[title]]</h3>
-    <gr-button
-        title$="[[tooltip]]"
-        disabled$="[[disabled]]"
-        on-click
-        ="_onCommandTap">
+    <gr-button title\$="[[tooltip]]" disabled\$="[[disabled]]" on-click="_onCommandTap">
       [[title]]
     </gr-button>
-  </template>
-  <script src="gr-repo-command.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-repo-command/gr-repo-command_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-repo-command</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-repo-command.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-repo-command.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-command.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,9 +40,12 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-repo-command tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-command.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+suite('gr-repo-command tests', () => {
   let element;
 
   setup(() => {
@@ -49,7 +57,7 @@ limitations under the License.
       done();
     });
     MockInteractions.tap(
-          Polymer.dom(element.root).querySelector('gr-button'));
+        dom(element.root).querySelector('gr-button'));
   });
 });
 </script>

polygerrit-ui/app/elements/admin/gr-repo-commands/gr-repo-commands.js

@@ -14,8 +14,25 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '@polymer/iron-autogrow-textarea/iron-autogrow-textarea.js';
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/gr-subpage-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../plugins/gr-endpoint-decorator/gr-endpoint-decorator.js';
+import '../../plugins/gr-endpoint-param/gr-endpoint-param.js';
+import '../../shared/gr-dialog/gr-dialog.js';
+import '../../shared/gr-overlay/gr-overlay.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../gr-create-change-dialog/gr-create-change-dialog.js';
+import '../gr-repo-command/gr-repo-command.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-repo-commands_html.js';
 
 const GC_MESSAGE = 'Garbage collection completed successfully.';
 
@@ -30,11 +47,13 @@
  * @appliesMixin Gerrit.FireMixin
  * @extends Polymer.Element
  */
-  class GrRepoCommands extends Polymer.mixinBehaviors( [
+class GrRepoCommands extends mixinBehaviors( [
   Gerrit.FireBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-repo-commands'; }
 
   static get properties() {
@@ -123,4 +142,3 @@
 }
 
 customElements.define(GrRepoCommands.is, GrRepoCommands);
-})();

polygerrit-ui/app/elements/admin/gr-repo-commands/gr-repo-commands_html.js

@@ -1,36 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/gr-subpage-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../plugins/gr-endpoint-decorator/gr-endpoint-decorator.html">
-<link rel="import" href="../../plugins/gr-endpoint-param/gr-endpoint-param.html">
-<link rel="import" href="../../shared/gr-dialog/gr-dialog.html">
-<link rel="import" href="../../shared/gr-overlay/gr-overlay.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../gr-create-change-dialog/gr-create-change-dialog.html">
-<link rel="import" href="../gr-repo-command/gr-repo-command.html">
-
-<dom-module id="gr-repo-commands">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -42,24 +28,15 @@ limitations under the License.
     </style>
     <main class="gr-form-styles read-only">
       <h1 id="Title">Repository Commands</h1>
-      <div id="loading" class$="[[_computeLoadingClass(_loading)]]">Loading...</div>
-      <div id="loadedContent" class$="[[_computeLoadingClass(_loading)]]">
+      <div id="loading" class\$="[[_computeLoadingClass(_loading)]]">Loading...</div>
+      <div id="loadedContent" class\$="[[_computeLoadingClass(_loading)]]">
         <h2 id="options">Command</h2>
         <div id="form">
-          <gr-repo-command
-              title="Create change"
-              on-command-tap="_createNewChange">
+          <gr-repo-command title="Create change" on-command-tap="_createNewChange">
           </gr-repo-command>
-          <gr-repo-command
-              id="editRepoConfig"
-              title="Edit repo config"
-              on-command-tap="_handleEditRepoConfig">
+          <gr-repo-command id="editRepoConfig" title="Edit repo config" on-command-tap="_handleEditRepoConfig">
           </gr-repo-command>
-          <gr-repo-command
-              title="[[_repoConfig.actions.gc.label]]"
-              tooltip="[[_repoConfig.actions.gc.title]]"
-              hidden$="[[!_repoConfig.actions.gc.enabled]]"
-              on-command-tap="_handleRunningGC">
+          <gr-repo-command title="[[_repoConfig.actions.gc.label]]" tooltip="[[_repoConfig.actions.gc.title]]" hidden\$="[[!_repoConfig.actions.gc.enabled]]" on-command-tap="_handleRunningGC">
           </gr-repo-command>
           <gr-endpoint-decorator name="repo-command">
             <gr-endpoint-param name="config" value="[[_repoConfig]]">
@@ -70,25 +47,15 @@ limitations under the License.
         </div>
       </div>
     </main>
-    <gr-overlay id="createChangeOverlay" with-backdrop>
-      <gr-dialog
-          id="createChangeDialog"
-          confirm-label="Create"
-          disabled="[[!_canCreate]]"
-          on-confirm="_handleCreateChange"
-          on-cancel="_handleCloseCreateChange">
+    <gr-overlay id="createChangeOverlay" with-backdrop="">
+      <gr-dialog id="createChangeDialog" confirm-label="Create" disabled="[[!_canCreate]]" on-confirm="_handleCreateChange" on-cancel="_handleCloseCreateChange">
         <div class="header" slot="header">
           Create Change
         </div>
         <div class="main" slot="main">
-          <gr-create-change-dialog
-              id="createNewChangeModal"
-              can-create="{{_canCreate}}"
-              repo-name="[[repo]]"></gr-create-change-dialog>
+          <gr-create-change-dialog id="createNewChangeModal" can-create="{{_canCreate}}" repo-name="[[repo]]"></gr-create-change-dialog>
         </div>
       </gr-dialog>
     </gr-overlay>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-repo-commands.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-repo-commands/gr-repo-commands_test.html

@@ -19,16 +19,21 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-repo-commands</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/page/page.js"></script>
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-repo-commands.html">
+<script src="/node_modules/page/page.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-repo-commands.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-commands.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -36,9 +41,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-repo-commands tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-commands.js';
+suite('gr-repo-commands tests', () => {
   let element;
   let sandbox;
   let repoStub;

polygerrit-ui/app/elements/admin/gr-repo-dashboards/gr-repo-dashboards.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright (C) 2017 The Android Open Source Project
+ * Copyright (C) 2018 The Android Open Source Project
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -14,18 +14,30 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../../styles/shared-styles.js';
+import '../../core/gr-navigation/gr-navigation.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import {flush} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-repo-dashboards_html.js';
 
 /**
  * @appliesMixin Gerrit.FireMixin
  * @extends Polymer.Element
  */
-  class GrRepoDashboards extends Polymer.mixinBehaviors( [
+class GrRepoDashboards extends mixinBehaviors( [
   Gerrit.FireBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-repo-dashboards'; }
 
   static get properties() {
@@ -75,7 +87,7 @@
 
       this._dashboards = dashboardBuilder;
       this._loading = false;
-        Polymer.dom.flush();
+      flush();
     });
   }
 
@@ -99,4 +111,3 @@
 }
 
 customElements.define(GrRepoDashboards.is, GrRepoDashboards);
-})();

polygerrit-ui/app/elements/admin/gr-repo-dashboards/gr-repo-dashboards_html.js

@@ -1,27 +1,22 @@
-<!--
-@license
-Copyright (C) 2018 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../core/gr-navigation/gr-navigation.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-
-<dom-module id="gr-repo-dashboards">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       :host {
         display: block;
@@ -38,8 +33,8 @@ limitations under the License.
     <style include="gr-table-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
-    <table id="list" class$="genericList [[_computeLoadingClass(_loading)]]">
-      <tr class="headerRow">
+    <table id="list" class\$="genericList [[_computeLoadingClass(_loading)]]">
+      <tbody><tr class="headerRow">
         <th class="topHeader">Dashboard name</th>
         <th class="topHeader">Dashboard title</th>
         <th class="topHeader">Dashboard description</th>
@@ -49,14 +44,14 @@ limitations under the License.
       <tr id="loadingContainer">
         <td>Loading...</td>
       </tr>
-      <tbody id="dashboards">
+      </tbody><tbody id="dashboards">
         <template is="dom-repeat" items="[[_dashboards]]">
           <tr class="groupHeader">
             <td colspan="5">[[item.section]]</td>
           </tr>
           <template is="dom-repeat" items="[[item.dashboards]]">
             <tr class="table">
-              <td class="name"><a href$="[[_getUrl(item.project, item.id)]]">[[item.path]]</a></td>
+              <td class="name"><a href\$="[[_getUrl(item.project, item.id)]]">[[item.path]]</a></td>
               <td class="title">[[item.title]]</td>
               <td class="desc">[[item.description]]</td>
               <td class="inherited">[[_computeInheritedFrom(item.project, item.defining_project)]]</td>
@@ -67,6 +62,4 @@ limitations under the License.
       </tbody>
     </table>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-repo-dashboards.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-repo-dashboards/gr-repo-dashboards_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-repo-dashboards</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-repo-dashboards.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-repo-dashboards.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-dashboards.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,9 +40,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-repo-dashboards tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-dashboards.js';
+suite('gr-repo-dashboards tests', () => {
   let element;
   let sandbox;
 

polygerrit-ui/app/elements/admin/gr-repo-detail-list/gr-repo-detail-list.js

@@ -14,8 +14,30 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.js';
+
+import '../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.js';
+import '@polymer/iron-input/iron-input.js';
+import '../../../scripts/bundled-polymer.js';
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/gr-table-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-account-link/gr-account-link.js';
+import '../../shared/gr-button/gr-button.js';
+import '../../shared/gr-date-formatter/gr-date-formatter.js';
+import '../../shared/gr-dialog/gr-dialog.js';
+import '../../shared/gr-list-view/gr-list-view.js';
+import '../../shared/gr-overlay/gr-overlay.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../gr-create-pointer-dialog/gr-create-pointer-dialog.js';
+import '../gr-confirm-delete-item-dialog/gr-confirm-delete-item-dialog.js';
+import {flush} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-repo-detail-list_html.js';
 
 const DETAIL_TYPES = {
   BRANCHES: 'branches',
@@ -30,13 +52,15 @@
  * @appliesMixin Gerrit.URLEncodingMixin
  * @extends Polymer.Element
  */
-  class GrRepoDetailList extends Polymer.mixinBehaviors( [
+class GrRepoDetailList extends mixinBehaviors( [
   Gerrit.ListViewBehavior,
   Gerrit.FireBehavior,
   Gerrit.URLEncodingBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-repo-detail-list'; }
 
   static get properties() {
@@ -126,7 +150,7 @@
   _getItems(filter, repo, itemsPerPage, offset, detailType) {
     this._loading = true;
     this._items = [];
-      Polymer.dom.flush();
+    flush();
     const errFn = response => {
       this.fire('page-error', {response});
     };
@@ -289,4 +313,3 @@
 }
 
 customElements.define(GrRepoDetailList.is, GrRepoDetailList);
-})();

polygerrit-ui/app/elements/admin/gr-repo-detail-list/gr-repo-detail-list_html.js

@@ -1,40 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.html">
-<link rel="import" href="../../../behaviors/gr-url-encoding-behavior/gr-url-encoding-behavior.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/gr-table-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-account-link/gr-account-link.html">
-<link rel="import" href="../../shared/gr-button/gr-button.html">
-<link rel="import" href="../../shared/gr-date-formatter/gr-date-formatter.html">
-<link rel="import" href="../../shared/gr-dialog/gr-dialog.html">
-<link rel="import" href="../../shared/gr-list-view/gr-list-view.html">
-<link rel="import" href="../../shared/gr-overlay/gr-overlay.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../gr-create-pointer-dialog/gr-create-pointer-dialog.html">
-<link rel="import" href="../gr-confirm-delete-item-dialog/gr-confirm-delete-item-dialog.html">
-
-<dom-module id="gr-repo-detail-list">
-  <template>
+export const htmlTemplate = html`
     <style include="gr-form-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -88,100 +70,68 @@ limitations under the License.
     <style include="gr-table-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
-    <gr-list-view
-        create-new="[[_loggedIn]]"
-        filter="[[_filter]]"
-        items-per-page="[[_itemsPerPage]]"
-        items="[[_items]]"
-        loading="[[_loading]]"
-        offset="[[_offset]]"
-        on-create-clicked="_handleCreateClicked"
-        path="[[_getPath(_repo, detailType)]]">
+    <gr-list-view create-new="[[_loggedIn]]" filter="[[_filter]]" items-per-page="[[_itemsPerPage]]" items="[[_items]]" loading="[[_loading]]" offset="[[_offset]]" on-create-clicked="_handleCreateClicked" path="[[_getPath(_repo, detailType)]]">
       <table id="list" class="genericList gr-form-styles">
-        <tr class="headerRow">
+        <tbody><tr class="headerRow">
           <th class="name topHeader">Name</th>
           <th class="revision topHeader">Revision</th>
-          <th class$="message topHeader [[_hideIfBranch(detailType)]]">
+          <th class\$="message topHeader [[_hideIfBranch(detailType)]]">
             Message</th>
-          <th class$="tagger topHeader [[_hideIfBranch(detailType)]]">
+          <th class\$="tagger topHeader [[_hideIfBranch(detailType)]]">
             Tagger</th>
           <th class="repositoryBrowser topHeader">
             Repository Browser</th>
           <th class="delete topHeader"></th>
         </tr>
-        <tr id="loading" class$="loadingMsg [[computeLoadingClass(_loading)]]">
+        <tr id="loading" class\$="loadingMsg [[computeLoadingClass(_loading)]]">
           <td>Loading...</td>
         </tr>
-        <tbody class$="[[computeLoadingClass(_loading)]]">
+        </tbody><tbody class\$="[[computeLoadingClass(_loading)]]">
           <template is="dom-repeat" items="[[_shownItems]]">
             <tr class="table">
-              <td class$="[[detailType]] name">[[_stripRefs(item.ref, detailType)]]</td>
-              <td class$="[[detailType]] revision [[_computeCanEditClass(item.ref, detailType, _isOwner)]]">
+              <td class\$="[[detailType]] name">[[_stripRefs(item.ref, detailType)]]</td>
+              <td class\$="[[detailType]] revision [[_computeCanEditClass(item.ref, detailType, _isOwner)]]">
                 <span class="revisionNoEditing">
                   [[item.revision]]
                 </span>
-                <span class$="revisionEdit [[_computeEditingClass(_isEditing)]]">
+                <span class\$="revisionEdit [[_computeEditingClass(_isEditing)]]">
                   <span class="revisionWithEditing">
                     [[item.revision]]
                   </span>
-                  <gr-button
-                      link
-                      on-click="_handleEditRevision"
-                      class="editBtn">
+                  <gr-button link="" on-click="_handleEditRevision" class="editBtn">
                     edit
                   </gr-button>
-                  <iron-input
-                      bind-value="{{_revisedRef}}"
-                      class="editItem">
-                    <input
-                        is="iron-input"
-                        bind-value="{{_revisedRef}}">
+                  <iron-input bind-value="{{_revisedRef}}" class="editItem">
+                    <input is="iron-input" bind-value="{{_revisedRef}}">
                   </iron-input>
-                  <gr-button
-                      link
-                      on-click="_handleCancelRevision"
-                      class="cancelBtn editItem">
+                  <gr-button link="" on-click="_handleCancelRevision" class="cancelBtn editItem">
                     Cancel
                   </gr-button>
-                  <gr-button
-                      link
-                      on-click="_handleSaveRevision"
-                      class="saveBtn editItem"
-                      disabled="[[!_revisedRef]]">
+                  <gr-button link="" on-click="_handleSaveRevision" class="saveBtn editItem" disabled="[[!_revisedRef]]">
                     Save
                   </gr-button>
                 </span>
               </td>
-              <td class$="message [[_hideIfBranch(detailType)]]">
+              <td class\$="message [[_hideIfBranch(detailType)]]">
                 [[_computeMessage(item.message)]]
               </td>
-              <td class$="tagger [[_hideIfBranch(detailType)]]">
-                <div class$="tagger [[_computeHideTagger(item.tagger)]]">
-                  <gr-account-link
-                      account="[[item.tagger]]">
+              <td class\$="tagger [[_hideIfBranch(detailType)]]">
+                <div class\$="tagger [[_computeHideTagger(item.tagger)]]">
+                  <gr-account-link account="[[item.tagger]]">
                   </gr-account-link>
-                  (<gr-date-formatter
-                      has-tooltip
-                      date-str="[[item.tagger.date]]">
+                  (<gr-date-formatter has-tooltip="" date-str="[[item.tagger.date]]">
                   </gr-date-formatter>)
                 </div>
               </td>
               <td class="repositoryBrowser">
-                <template is="dom-repeat"
-                    items="[[_computeWeblink(item)]]" as="link">
-                  <a href$="[[link.url]]"
-                      class="webLink"
-                      rel="noopener"
-                      target="_blank">
+                <template is="dom-repeat" items="[[_computeWeblink(item)]]" as="link">
+                  <a href\$="[[link.url]]" class="webLink" rel="noopener" target="_blank">
                     ([[link.name]])
                   </a>
                 </template>
               </td>
               <td class="delete">
-                <gr-button
-                    link
-                    class$="deleteButton [[_computeHideDeleteClass(_isOwner, item.can_delete)]]"
-                    on-click="_handleDeleteItem">
+                <gr-button link="" class\$="deleteButton [[_computeHideDeleteClass(_isOwner, item.can_delete)]]" on-click="_handleDeleteItem">
                   Delete
                 </gr-button>
               </td>
@@ -189,36 +139,19 @@ limitations under the License.
           </template>
         </tbody>
       </table>
-      <gr-overlay id="overlay" with-backdrop>
-        <gr-confirm-delete-item-dialog
-            class="confirmDialog"
-            on-confirm="_handleDeleteItemConfirm"
-            on-cancel="_handleConfirmDialogCancel"
-            item="[[_refName]]"
-            item-type="[[detailType]]"></gr-confirm-delete-item-dialog>
+      <gr-overlay id="overlay" with-backdrop="">
+        <gr-confirm-delete-item-dialog class="confirmDialog" on-confirm="_handleDeleteItemConfirm" on-cancel="_handleConfirmDialogCancel" item="[[_refName]]" item-type="[[detailType]]"></gr-confirm-delete-item-dialog>
       </gr-overlay>
     </gr-list-view>
-    <gr-overlay id="createOverlay" with-backdrop>
-      <gr-dialog
-          id="createDialog"
-          disabled="[[!_hasNewItemName]]"
-          confirm-label="Create"
-          on-confirm="_handleCreateItem"
-          on-cancel="_handleCloseCreate">
+    <gr-overlay id="createOverlay" with-backdrop="">
+      <gr-dialog id="createDialog" disabled="[[!_hasNewItemName]]" confirm-label="Create" on-confirm="_handleCreateItem" on-cancel="_handleCloseCreate">
         <div class="header" slot="header">
           Create [[_computeItemName(detailType)]]
         </div>
         <div class="main" slot="main">
-          <gr-create-pointer-dialog
-              id="createNewModal"
-              detail-type="[[_computeItemName(detailType)]]"
-              has-new-item-name="{{_hasNewItemName}}"
-              item-detail="[[detailType]]"
-              repo-name="[[_repo]]"></gr-create-pointer-dialog>
+          <gr-create-pointer-dialog id="createNewModal" detail-type="[[_computeItemName(detailType)]]" has-new-item-name="{{_hasNewItemName}}" item-detail="[[detailType]]" repo-name="[[_repo]]"></gr-create-pointer-dialog>
         </div>
       </gr-dialog>
     </gr-overlay>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-repo-detail-list.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-repo-detail-list/gr-repo-detail-list_test.html

@@ -19,16 +19,21 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-repo-detail-list</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/page/page.js"></script>
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-repo-detail-list.html">
+<script src="/node_modules/page/page.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-repo-detail-list.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-detail-list.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -36,7 +41,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-detail-list.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
 let counter;
 const branchGenerator = () => {
   return {
@@ -70,8 +79,7 @@ limitations under the License.
   };
 };
 
-  suite('gr-repo-detail-list', async () => {
-    await readyToTest();
+suite('gr-repo-detail-list', () => {
   suite('Branches', () => {
     let element;
     let branches;
@@ -145,21 +153,21 @@ limitations under the License.
             }));
         element._determineIfOwner('test').then(() => {
           assert.equal(element._isOwner, false);
-            assert.equal(getComputedStyle(Polymer.dom(element.root)
+          assert.equal(getComputedStyle(dom(element.root)
               .querySelector('.revisionNoEditing')).display, 'inline');
-            assert.equal(getComputedStyle(Polymer.dom(element.root)
+          assert.equal(getComputedStyle(dom(element.root)
               .querySelector('.revisionEdit')).display, 'none');
           done();
         });
       });
 
       test('Edit HEAD button admin', done => {
-          const saveBtn = Polymer.dom(element.root).querySelector('.saveBtn');
-          const cancelBtn = Polymer.dom(element.root).querySelector('.cancelBtn');
-          const editBtn = Polymer.dom(element.root).querySelector('.editBtn');
-          const revisionNoEditing = Polymer.dom(element.root)
+        const saveBtn = dom(element.root).querySelector('.saveBtn');
+        const cancelBtn = dom(element.root).querySelector('.cancelBtn');
+        const editBtn = dom(element.root).querySelector('.editBtn');
+        const revisionNoEditing = dom(element.root)
             .querySelector('.revisionNoEditing');
-          const revisionWithEditing = Polymer.dom(element.root)
+        const revisionWithEditing = dom(element.root)
             .querySelector('.revisionWithEditing');
 
         sandbox.stub(element, '_getLoggedIn').returns(Promise.resolve(true));
@@ -174,7 +182,7 @@ limitations under the License.
           assert.equal(getComputedStyle(revisionNoEditing).display, 'none');
 
           // The revision container for editing enabled row is visible.
-            assert.notEqual(getComputedStyle(Polymer.dom(element.root)
+          assert.notEqual(getComputedStyle(dom(element.root)
               .querySelector('.revisionEdit')).display, 'none');
 
           // The revision and edit button are visible.
@@ -183,7 +191,7 @@ limitations under the License.
           assert.notEqual(getComputedStyle(editBtn).display, 'none');
 
           // The input, cancel, and save buttons are not visible.
-            const hiddenElements = Polymer.dom(element.root)
+          const hiddenElements = dom(element.root)
               .querySelectorAll('.canEdit .editItem');
 
           for (const item of hiddenElements) {

polygerrit-ui/app/elements/admin/gr-repo-list/gr-repo-list.js

@@ -14,18 +14,33 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.js';
+import '../../../styles/gr-table-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-dialog/gr-dialog.js';
+import '../../shared/gr-list-view/gr-list-view.js';
+import '../../shared/gr-overlay/gr-overlay.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../gr-create-repo-dialog/gr-create-repo-dialog.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-repo-list_html.js';
 
 /**
  * @appliesMixin Gerrit.ListViewMixin
  * @extends Polymer.Element
  */
-  class GrRepoList extends Polymer.mixinBehaviors( [
+class GrRepoList extends mixinBehaviors( [
   Gerrit.ListViewBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-repo-list'; }
 
   static get properties() {
@@ -170,4 +185,3 @@
 }
 
 customElements.define(GrRepoList.is, GrRepoList);
-})();

polygerrit-ui/app/elements/admin/gr-repo-list/gr-repo-list_html.js

@@ -1,32 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-<link rel="import" href="/bower_components/polymer/polymer.html">
-
-<link rel="import" href="../../../behaviors/gr-list-view-behavior/gr-list-view-behavior.html">
-<link rel="import" href="../../../styles/gr-table-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-dialog/gr-dialog.html">
-<link rel="import" href="../../shared/gr-list-view/gr-list-view.html">
-<link rel="import" href="../../shared/gr-overlay/gr-overlay.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../gr-create-repo-dialog/gr-create-repo-dialog.html">
-
-<dom-module id="gr-repo-list">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -47,44 +37,32 @@ limitations under the License.
         white-space:nowrap;
       }
     </style>
-    <gr-list-view
-        create-new=[[_createNewCapability]]
-        filter="[[_filter]]"
-        items-per-page="[[_reposPerPage]]"
-        items="[[_repos]]"
-        loading="[[_loading]]"
-        offset="[[_offset]]"
-        on-create-clicked="_handleCreateClicked"
-        path="[[_path]]">
+    <gr-list-view create-new="[[_createNewCapability]]" filter="[[_filter]]" items-per-page="[[_reposPerPage]]" items="[[_repos]]" loading="[[_loading]]" offset="[[_offset]]" on-create-clicked="_handleCreateClicked" path="[[_path]]">
       <table id="list" class="genericList">
-        <tr class="headerRow">
+        <tbody><tr class="headerRow">
           <th class="name topHeader">Repository Name</th>
           <th class="repositoryBrowser topHeader">Repository Browser</th>
           <th class="changesLink topHeader">Changes</th>
           <th class="topHeader readOnly">Read only</th>
           <th class="description topHeader">Repository Description</th>
         </tr>
-        <tr id="loading" class$="loadingMsg [[computeLoadingClass(_loading)]]">
+        <tr id="loading" class\$="loadingMsg [[computeLoadingClass(_loading)]]">
           <td>Loading...</td>
         </tr>
-        <tbody class$="[[computeLoadingClass(_loading)]]">
+        </tbody><tbody class\$="[[computeLoadingClass(_loading)]]">
           <template is="dom-repeat" items="[[_shownRepos]]">
             <tr class="table">
               <td class="name">
-                <a href$="[[_computeRepoUrl(item.name)]]">[[item.name]]</a>
+                <a href\$="[[_computeRepoUrl(item.name)]]">[[item.name]]</a>
               </td>
               <td class="repositoryBrowser">
-                <template is="dom-repeat"
-                    items="[[_computeWeblink(item)]]" as="link">
-                  <a href$="[[link.url]]"
-                      class="webLink"
-                      rel="noopener"
-                      target="_blank">
+                <template is="dom-repeat" items="[[_computeWeblink(item)]]" as="link">
+                  <a href\$="[[link.url]]" class="webLink" rel="noopener" target="_blank">
                     [[link.name]]
                   </a>
                 </template>
               </td>
-              <td class="changesLink"><a href$="[[_computeChangesLink(item.name)]]">view all</a></td>
+              <td class="changesLink"><a href\$="[[_computeChangesLink(item.name)]]">view all</a></td>
               <td class="readOnly">[[_readOnly(item)]]</td>
               <td class="description">[[item.description]]</td>
             </tr>
@@ -92,26 +70,15 @@ limitations under the License.
         </tbody>
       </table>
     </gr-list-view>
-    <gr-overlay id="createOverlay" with-backdrop>
-      <gr-dialog
-          id="createDialog"
-          class="confirmDialog"
-          disabled="[[!_hasNewRepoName]]"
-          confirm-label="Create"
-          on-confirm="_handleCreateRepo"
-          on-cancel="_handleCloseCreate">
+    <gr-overlay id="createOverlay" with-backdrop="">
+      <gr-dialog id="createDialog" class="confirmDialog" disabled="[[!_hasNewRepoName]]" confirm-label="Create" on-confirm="_handleCreateRepo" on-cancel="_handleCloseCreate">
         <div class="header" slot="header">
           Create Repository
         </div>
         <div class="main" slot="main">
-          <gr-create-repo-dialog
-              has-new-repo-name="{{_hasNewRepoName}}"
-              params="[[params]]"
-              id="createNewModal"></gr-create-repo-dialog>
+          <gr-create-repo-dialog has-new-repo-name="{{_hasNewRepoName}}" params="[[params]]" id="createNewModal"></gr-create-repo-dialog>
         </div>
       </gr-dialog>
     </gr-overlay>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-repo-list.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-repo-list/gr-repo-list_test.html

@@ -19,16 +19,21 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-repo-list</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/page/page.js"></script>
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-repo-list.html">
+<script src="/node_modules/page/page.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-repo-list.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-list.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -36,7 +41,10 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-list.js';
 let counter;
 const repoGenerator = () => {
   return {
@@ -51,8 +59,7 @@ limitations under the License.
   };
 };
 
-  suite('gr-repo-list tests', async () => {
-    await readyToTest();
+suite('gr-repo-list tests', () => {
   let element;
   let repos;
   let sandbox;

polygerrit-ui/app/elements/admin/gr-repo-plugin-config/gr-repo-plugin-config.js

@@ -14,18 +14,36 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '@polymer/iron-input/iron-input.js';
+import '@polymer/paper-toggle-button/paper-toggle-button.js';
+import '../../../behaviors/gr-repo-plugin-config-behavior/gr-repo-plugin-config-behavior.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/gr-subpage-styles.js';
+import '../../../styles/shared-styles.js';
+import '../../shared/gr-icons/gr-icons.js';
+import '../../shared/gr-select/gr-select.js';
+import '../../shared/gr-tooltip-content/gr-tooltip-content.js';
+import '../gr-plugin-config-array-editor/gr-plugin-config-array-editor.js';
+import {dom} from '@polymer/polymer/lib/legacy/polymer.dom.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-repo-plugin-config_html.js';
 
 /**
  * @appliesMixin Gerrit.RepoPluginConfigMixin
  * @extends Polymer.Element
  */
-  class GrRepoPluginConfig extends Polymer.mixinBehaviors( [
+class GrRepoPluginConfig extends mixinBehaviors( [
   Gerrit.RepoPluginConfig,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-repo-plugin-config'; }
   /**
    * Fired when the plugin config changes.
@@ -85,7 +103,7 @@
   }
 
   _handleStringChange(e) {
-      const el = Polymer.dom(e).localTarget;
+    const el = dom(e).localTarget;
     const _key = el.getAttribute('data-option-key');
     const configChangeInfo =
         this._buildConfigChangeInfo(el.value, _key);
@@ -93,7 +111,7 @@
   }
 
   _handleListChange(e) {
-      const el = Polymer.dom(e).localTarget;
+    const el = dom(e).localTarget;
     const _key = el.getAttribute('data-option-key');
     const configChangeInfo =
         this._buildConfigChangeInfo(el.value, _key);
@@ -101,7 +119,7 @@
   }
 
   _handleBooleanChange(e) {
-      const el = Polymer.dom(e).localTarget;
+    const el = dom(e).localTarget;
     const _key = el.getAttribute('data-option-key');
     const configChangeInfo =
         this._buildConfigChangeInfo(JSON.stringify(el.checked), _key);
@@ -138,4 +156,3 @@
 }
 
 customElements.define(GrRepoPluginConfig.is, GrRepoPluginConfig);
-})();

polygerrit-ui/app/elements/admin/gr-repo-plugin-config/gr-repo-plugin-config_html.js

@@ -1,35 +1,22 @@
-<!--
-@license
-Copyright (C) 2018 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
-<link rel="import" href="/bower_components/paper-toggle-button/paper-toggle-button.html">
-
-<link rel="import" href="../../../behaviors/gr-repo-plugin-config-behavior/gr-repo-plugin-config-behavior.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/gr-subpage-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../../shared/gr-icons/gr-icons.html">
-<link rel="import" href="../../shared/gr-select/gr-select.html">
-<link rel="import" href="../../shared/gr-tooltip-content/gr-tooltip-content.html">
-<link rel="import" href="../gr-plugin-config-array-editor/gr-plugin-config-array-editor.html">
-
-<dom-module id="gr-repo-plugin-config">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -53,55 +40,31 @@ limitations under the License.
       <fieldset>
         <h4>[[pluginData.name]]</h4>
         <template is="dom-repeat" items="[[_pluginConfigOptions]]" as="option">
-          <section class$="section [[option.info.type]]">
+          <section class\$="section [[option.info.type]]">
             <span class="title">
-              <gr-tooltip-content
-                  has-tooltip="[[option.info.description]]"
-                  show-icon="[[option.info.description]]"
-                  title="[[option.info.description]]">
+              <gr-tooltip-content has-tooltip="[[option.info.description]]" show-icon="[[option.info.description]]" title="[[option.info.description]]">
                 <span>[[option.info.display_name]]</span>
               </gr-tooltip-content>
             </span>
             <span class="value">
               <template is="dom-if" if="[[_isArray(option.info.type)]]">
-                <gr-plugin-config-array-editor
-                    on-plugin-config-option-changed="_handleArrayChange"
-                    plugin-option="[[option]]"></gr-plugin-config-array-editor>
+                <gr-plugin-config-array-editor on-plugin-config-option-changed="_handleArrayChange" plugin-option="[[option]]"></gr-plugin-config-array-editor>
               </template>
               <template is="dom-if" if="[[_isBoolean(option.info.type)]]">
-                <paper-toggle-button
-                    checked="[[_computeChecked(option.info.value)]]"
-                    on-change="_handleBooleanChange"
-                    data-option-key$="[[option._key]]"
-                    disabled$="[[_computeDisabled(option.info.editable)]]"></paper-toggle-button>
+                <paper-toggle-button checked="[[_computeChecked(option.info.value)]]" on-change="_handleBooleanChange" data-option-key\$="[[option._key]]" disabled\$="[[_computeDisabled(option.info.editable)]]"></paper-toggle-button>
               </template>
               <template is="dom-if" if="[[_isList(option.info.type)]]">
-                <gr-select
-                    bind-value$="[[option.info.value]]"
-                    on-change="_handleListChange">
-                  <select
-                      data-option-key$="[[option._key]]"
-                      disabled$="[[_computeDisabled(option.info.editable)]]">
-                    <template is="dom-repeat"
-                        items="[[option.info.permitted_values]]"
-                        as="value">
-                      <option value$="[[value]]">[[value]]</option>
+                <gr-select bind-value\$="[[option.info.value]]" on-change="_handleListChange">
+                  <select data-option-key\$="[[option._key]]" disabled\$="[[_computeDisabled(option.info.editable)]]">
+                    <template is="dom-repeat" items="[[option.info.permitted_values]]" as="value">
+                      <option value\$="[[value]]">[[value]]</option>
                     </template>
                   </select>
                 </gr-select>
               </template>
               <template is="dom-if" if="[[_isString(option.info.type)]]">
-                <iron-input
-                    bind-value="[[option.info.value]]"
-                    on-input="_handleStringChange"
-                    data-option-key$="[[option._key]]"
-                    disabled$="[[_computeDisabled(option.info.editable)]]">
-                  <input
-                      is="iron-input"
-                      value="[[option.info.value]]"
-                      on-input="_handleStringChange"
-                      data-option-key$="[[option._key]]"
-                      disabled$="[[_computeDisabled(option.info.editable)]]">
+                <iron-input bind-value="[[option.info.value]]" on-input="_handleStringChange" data-option-key\$="[[option._key]]" disabled\$="[[_computeDisabled(option.info.editable)]]">
+                  <input is="iron-input" value="[[option.info.value]]" on-input="_handleStringChange" data-option-key\$="[[option._key]]" disabled\$="[[_computeDisabled(option.info.editable)]]">
                 </iron-input>
               </template>
               <template is="dom-if" if="[[option.info.inherited_value]]">
@@ -114,6 +77,4 @@ limitations under the License.
         </template>
       </fieldset>
     </div>
-  </template>
-  <script src="gr-repo-plugin-config.js"></script>
-</dom-module>
+`;

polygerrit-ui/app/elements/admin/gr-repo-plugin-config/gr-repo-plugin-config_test.html

@@ -19,15 +19,20 @@ limitations under the License.
 <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 <title>gr-repo-plugin-config</title>
 
-<script src="/bower_components/webcomponentsjs/custom-elements-es5-adapter.js"></script>
+<script src="/node_modules/@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js"></script>
 
-<script src="/bower_components/webcomponentsjs/webcomponents-lite.js"></script>
-<script src="/bower_components/web-component-tester/browser.js"></script>
-<script src="../../../test/test-pre-setup.js"></script>
-<link rel="import" href="../../../test/common-test-setup.html"/>
-<link rel="import" href="gr-repo-plugin-config.html">
+<script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-lite.js"></script>
+<script src="/components/wct-browser-legacy/browser.js"></script>
+<script type="module" src="../../../test/test-pre-setup.js"></script>
+<script type="module" src="../../../test/common-test-setup.js"></script>
+<script type="module" src="./gr-repo-plugin-config.js"></script>
 
-<script>void(0);</script>
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-plugin-config.js';
+void(0);
+</script>
 
 <test-fixture id="basic">
   <template>
@@ -35,9 +40,11 @@ limitations under the License.
   </template>
 </test-fixture>
 
-<script>
-  suite('gr-repo-plugin-config tests', async () => {
-    await readyToTest();
+<script type="module">
+import '../../../test/test-pre-setup.js';
+import '../../../test/common-test-setup.js';
+import './gr-repo-plugin-config.js';
+suite('gr-repo-plugin-config tests', () => {
   let element;
   let sandbox;
 

polygerrit-ui/app/elements/admin/gr-repo/gr-repo.js

@@ -14,8 +14,25 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-(function() {
-  'use strict';
+import '../../../scripts/bundled-polymer.js';
+
+import '@polymer/iron-autogrow-textarea/iron-autogrow-textarea.js';
+import '@polymer/iron-input/iron-input.js';
+import '../../../behaviors/fire-behavior/fire-behavior.js';
+import '../../plugins/gr-endpoint-decorator/gr-endpoint-decorator.js';
+import '../../plugins/gr-endpoint-param/gr-endpoint-param.js';
+import '../../shared/gr-download-commands/gr-download-commands.js';
+import '../../shared/gr-rest-api-interface/gr-rest-api-interface.js';
+import '../../shared/gr-select/gr-select.js';
+import '../../../styles/gr-form-styles.js';
+import '../../../styles/gr-subpage-styles.js';
+import '../../../styles/shared-styles.js';
+import '../gr-repo-plugin-config/gr-repo-plugin-config.js';
+import {mixinBehaviors} from '@polymer/polymer/lib/legacy/class.js';
+import {GestureEventListeners} from '@polymer/polymer/lib/mixins/gesture-event-listeners.js';
+import {LegacyElementMixin} from '@polymer/polymer/lib/legacy/legacy-element-mixin.js';
+import {PolymerElement} from '@polymer/polymer/polymer-element.js';
+import {htmlTemplate} from './gr-repo_html.js';
 
 const STATES = {
   active: {value: 'ACTIVE', label: 'Active'},
@@ -55,11 +72,13 @@
  * @appliesMixin Gerrit.FireMixin
  * @extends Polymer.Element
  */
-  class GrRepo extends Polymer.mixinBehaviors( [
+class GrRepo extends mixinBehaviors( [
   Gerrit.FireBehavior,
-  ], Polymer.GestureEventListeners(
-      Polymer.LegacyElementMixin(
-          Polymer.Element))) {
+], GestureEventListeners(
+    LegacyElementMixin(
+        PolymerElement))) {
+  static get template() { return htmlTemplate; }
+
   static get is() { return 'gr-repo'; }
 
   static get properties() {
@@ -358,4 +377,3 @@
 }
 
 customElements.define(GrRepo.is, GrRepo);
-})();

polygerrit-ui/app/elements/admin/gr-repo/gr-repo_html.js

@@ -1,37 +1,22 @@
-<!--
-@license
-Copyright (C) 2017 The Android Open Source Project
+/**
+ * @license
+ * Copyright (C) 2020 The Android Open Source Project
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import {html} from '@polymer/polymer/lib/utils/html-tag.js';
 
-Licensed under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License.
-You may obtain a copy of the License at
-
-http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software
-distributed under the License is distributed on an "AS IS" BASIS,
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-See the License for the specific language governing permissions and
-limitations under the License.
--->
-
-<link rel="import" href="/bower_components/polymer/polymer.html">
-<link rel="import" href="/bower_components/iron-autogrow-textarea/iron-autogrow-textarea.html">
-<link rel="import" href="/bower_components/iron-input/iron-input.html">
-<link rel="import" href="../../../behaviors/fire-behavior/fire-behavior.html">
-
-<link rel="import" href="../../plugins/gr-endpoint-decorator/gr-endpoint-decorator.html">
-<link rel="import" href="../../plugins/gr-endpoint-param/gr-endpoint-param.html">
-<link rel="import" href="../../shared/gr-download-commands/gr-download-commands.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
-<link rel="import" href="../../shared/gr-select/gr-select.html">
-<link rel="import" href="../../../styles/gr-form-styles.html">
-<link rel="import" href="../../../styles/gr-subpage-styles.html">
-<link rel="import" href="../../../styles/shared-styles.html">
-<link rel="import" href="../gr-repo-plugin-config/gr-repo-plugin-config.html">
-
-<dom-module id="gr-repo">
-  <template>
+export const htmlTemplate = html`
     <style include="shared-styles">
       /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
     </style>
@@ -65,50 +50,37 @@ limitations under the License.
         /* Workaround for empty style block - see https://github.com/Polymer/tools/issues/408 */
       </style>
       <div class="info">
-        <h1 id="Title" class$="name">
+        <h1 id="Title" class\$="name">
           [[repo]]
-          <hr/>
+          <hr>
         </h1>
         <div>
-          <a href$="[[_computeChangesUrl(repo)]]">(view changes)</a>
+          <a href\$="[[_computeChangesUrl(repo)]]">(view changes)</a>
         </div>
       </div>
-      <div id="loading" class$="[[_computeLoadingClass(_loading)]]">Loading...</div>
-      <div id="loadedContent" class$="[[_computeLoadingClass(_loading)]]">
-        <div id="downloadContent" class$="[[_computeHideClass(_schemes)]]">
+      <div id="loading" class\$="[[_computeLoadingClass(_loading)]]">Loading...</div>
+      <div id="loadedContent" class\$="[[_computeLoadingClass(_loading)]]">
+        <div id="downloadContent" class\$="[[_computeHideClass(_schemes)]]">
           <h2 id="download">Download</h2>
           <fieldset>
-            <gr-download-commands
-                id="downloadCommands"
-                commands="[[_computeCommands(repo, _schemesObj, _selectedScheme)]]"
-                schemes="[[_schemes]]"
-                selected-scheme="{{_selectedScheme}}"></gr-download-commands>
+            <gr-download-commands id="downloadCommands" commands="[[_computeCommands(repo, _schemesObj, _selectedScheme)]]" schemes="[[_schemes]]" selected-scheme="{{_selectedScheme}}"></gr-download-commands>
           </fieldset>
         </div>
-        <h2 id="configurations"
-            class$="[[_computeHeaderClass(_configChanged)]]">Configurations</h2>
+        <h2 id="configurations" class\$="[[_computeHeaderClass(_configChanged)]]">Configurations</h2>
         <div id="form">
           <fieldset>
             <h3 id="Description">Description</h3>
             <fieldset>
-              <iron-autogrow-textarea
-                  id="descriptionInput"
-                  class="description"
-                  autocomplete="on"
-                  placeholder="<Insert repo description here>"
-                  bind-value="{{_repoConfig.description}}"
-                  disabled$="[[_readOnly]]"></iron-autogrow-textarea>
+              <iron-autogrow-textarea id="descriptionInput" class="description" autocomplete="on" placeholder="<Insert repo description here>" bind-value="{{_repoConfig.description}}" disabled\$="[[_readOnly]]"></iron-autogrow-textarea>
             </fieldset>
             <h3 id="Options">Repository Options</h3>
             <fieldset id="options">
               <section>
                 <span class="title">State</span>
                 <span class="value">
-                  <gr-select
-                      id="stateSelect"
-                      bind-value="{{_repoConfig.state}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat" items=[[_states]]>
+                  <gr-select id="stateSelect" bind-value="{{_repoConfig.state}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_states]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                     </select>
@@ -118,12 +90,9 @@ limitations under the License.
               <section>
                 <span class="title">Submit type</span>
                 <span class="value">
-                  <gr-select
-                      id="submitTypeSelect"
-                      bind-value="{{_repoConfig.submit_type}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatSubmitTypeSelect(_repoConfig)]]">
+                  <gr-select id="submitTypeSelect" bind-value="{{_repoConfig.submit_type}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatSubmitTypeSelect(_repoConfig)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                     </select>
@@ -133,12 +102,9 @@ limitations under the License.
               <section>
                 <span class="title">Allow content merges</span>
                 <span class="value">
-                  <gr-select
-                      id="contentMergeSelect"
-                      bind-value="{{_repoConfig.use_content_merge.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatBooleanSelect(_repoConfig.use_content_merge)]]">
+                  <gr-select id="contentMergeSelect" bind-value="{{_repoConfig.use_content_merge.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.use_content_merge)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                     </select>
@@ -150,12 +116,9 @@ limitations under the License.
                   Create a new change for every commit not in the target branch
                 </span>
                 <span class="value">
-                  <gr-select
-                      id="newChangeSelect"
-                      bind-value="{{_repoConfig.create_new_change_for_all_not_in_target.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatBooleanSelect(_repoConfig.create_new_change_for_all_not_in_target)]]">
+                  <gr-select id="newChangeSelect" bind-value="{{_repoConfig.create_new_change_for_all_not_in_target.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.create_new_change_for_all_not_in_target)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                     </select>
@@ -165,46 +128,33 @@ limitations under the License.
               <section>
                 <span class="title">Require Change-Id in commit message</span>
                 <span class="value">
-                  <gr-select
-                      id="requireChangeIdSelect"
-                      bind-value="{{_repoConfig.require_change_id.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatBooleanSelect(_repoConfig.require_change_id)]]">
+                  <gr-select id="requireChangeIdSelect" bind-value="{{_repoConfig.require_change_id.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.require_change_id)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                     </select>
                   </gr-select>
                 </span>
               </section>
-              <section
-                   id="enableSignedPushSettings"
-                   class$="repositorySettings [[_computeRepositoriesClass(_repoConfig.enable_signed_push)]]">
+              <section id="enableSignedPushSettings" class\$="repositorySettings [[_computeRepositoriesClass(_repoConfig.enable_signed_push)]]">
                 <span class="title">Enable signed push</span>
                 <span class="value">
-                  <gr-select
-                      id="enableSignedPush"
-                      bind-value="{{_repoConfig.enable_signed_push.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatBooleanSelect(_repoConfig.enable_signed_push)]]">
+                  <gr-select id="enableSignedPush" bind-value="{{_repoConfig.enable_signed_push.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.enable_signed_push)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                     </select>
                   </gr-select>
                 </span>
               </section>
-              <section
-                   id="requireSignedPushSettings"
-                   class$="repositorySettings [[_computeRepositoriesClass(_repoConfig.require_signed_push)]]">
+              <section id="requireSignedPushSettings" class\$="repositorySettings [[_computeRepositoriesClass(_repoConfig.require_signed_push)]]">
                 <span class="title">Require signed push</span>
                 <span class="value">
-                  <gr-select
-                      id="requireSignedPush"
-                      bind-value="{{_repoConfig.require_signed_push.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatBooleanSelect(_repoConfig.require_signed_push)]]">
+                  <gr-select id="requireSignedPush" bind-value="{{_repoConfig.require_signed_push.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.require_signed_push)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                     </select>
@@ -215,12 +165,9 @@ limitations under the License.
                 <span class="title">
                   Reject implicit merges when changes are pushed for review</span>
                 <span class="value">
-                  <gr-select
-                      id="rejectImplicitMergesSelect"
-                      bind-value="{{_repoConfig.reject_implicit_merges.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatBooleanSelect(_repoConfig.reject_implicit_merges)]]">
+                  <gr-select id="rejectImplicitMergesSelect" bind-value="{{_repoConfig.reject_implicit_merges.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.reject_implicit_merges)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                     </select>
@@ -231,12 +178,9 @@ limitations under the License.
                 <span class="title">
                   Enable adding unregistered users as reviewers and CCs on changes</span>
                 <span class="value">
-                  <gr-select
-                      id="unRegisteredCcSelect"
-                      bind-value="{{_repoConfig.enable_reviewer_by_email.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatBooleanSelect(_repoConfig.enable_reviewer_by_email)]]">
+                  <gr-select id="unRegisteredCcSelect" bind-value="{{_repoConfig.enable_reviewer_by_email.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.enable_reviewer_by_email)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                   </select>
@@ -247,12 +191,9 @@ limitations under the License.
                 <span class="title">
                   Set all new changes private by default</span>
                 <span class="value">
-                  <gr-select
-                      id="setAllnewChangesPrivateByDefaultSelect"
-                      bind-value="{{_repoConfig.private_by_default.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatBooleanSelect(_repoConfig.private_by_default)]]">
+                  <gr-select id="setAllnewChangesPrivateByDefaultSelect" bind-value="{{_repoConfig.private_by_default.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.private_by_default)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                     </select>
@@ -263,12 +204,9 @@ limitations under the License.
                 <span class="title">
                   Set new changes to "work in progress" by default</span>
                 <span class="value">
-                  <gr-select
-                      id="setAllNewChangesWorkInProgressByDefaultSelect"
-                      bind-value="{{_repoConfig.work_in_progress_by_default.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatBooleanSelect(_repoConfig.work_in_progress_by_default)]]">
+                  <gr-select id="setAllNewChangesWorkInProgressByDefaultSelect" bind-value="{{_repoConfig.work_in_progress_by_default.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.work_in_progress_by_default)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                     </select>
@@ -278,17 +216,8 @@ limitations under the License.
               <section>
                 <span class="title">Maximum Git object size limit</span>
                 <span class="value">
-                  <iron-input
-                      id="maxGitObjSizeIronInput"
-                      bind-value="{{_repoConfig.max_object_size_limit.configured_value}}"
-                      type="text"
-                      disabled$="[[_readOnly]]">
-                    <input
-                        id="maxGitObjSizeInput"
-                        bind-value="{{_repoConfig.max_object_size_limit.configured_value}}"
-                        is="iron-input"
-                        type="text"
-                        disabled$="[[_readOnly]]">
+                  <iron-input id="maxGitObjSizeIronInput" bind-value="{{_repoConfig.max_object_size_limit.configured_value}}" type="text" disabled\$="[[_readOnly]]">
+                    <input id="maxGitObjSizeInput" bind-value="{{_repoConfig.max_object_size_limit.configured_value}}" is="iron-input" type="text" disabled\$="[[_readOnly]]">
                   </iron-input>
                   <template is="dom-if" if="[[_repoConfig.max_object_size_limit.value]]">
                     effective: [[_repoConfig.max_object_size_limit.value]] bytes
@@ -298,12 +227,9 @@ limitations under the License.
               <section>
                 <span class="title">Match authored date with committer date upon submit</span>
                 <span class="value">
-                  <gr-select
-                      id="matchAuthoredDateWithCommitterDateSelect"
-                      bind-value="{{_repoConfig.match_author_to_committer_date.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatBooleanSelect(_repoConfig.match_author_to_committer_date)]]">
+                  <gr-select id="matchAuthoredDateWithCommitterDateSelect" bind-value="{{_repoConfig.match_author_to_committer_date.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.match_author_to_committer_date)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                   </select>
@@ -313,12 +239,9 @@ limitations under the License.
               <section>
                 <span class="title">Reject empty commit upon submit</span>
                 <span class="value">
-                  <gr-select
-                      id="rejectEmptyCommitSelect"
-                      bind-value="{{_repoConfig.reject_empty_commit.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                                items="[[_formatBooleanSelect(_repoConfig.reject_empty_commit)]]">
+                  <gr-select id="rejectEmptyCommitSelect" bind-value="{{_repoConfig.reject_empty_commit.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.reject_empty_commit)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                   </select>
@@ -332,12 +255,9 @@ limitations under the License.
                 <span class="title">
                   Require a valid contributor agreement to upload</span>
                 <span class="value">
-                  <gr-select
-                      id="contributorAgreementSelect"
-                      bind-value="{{_repoConfig.use_contributor_agreements.configured_value}}">
-                  <select disabled$="[[_readOnly]]">
-                    <template is="dom-repeat"
-                        items="[[_formatBooleanSelect(_repoConfig.use_contributor_agreements)]]">
+                  <gr-select id="contributorAgreementSelect" bind-value="{{_repoConfig.use_contributor_agreements.configured_value}}">
+                  <select disabled\$="[[_readOnly]]">
+                    <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.use_contributor_agreements)]]">
                       <option value="[[item.value]]">[[item.label]]</option>
                     </template>
                     </select>
@@ -347,12 +267,9 @@ limitations under the License.
               <section>
                 <span class="title">Require Signed-off-by in commit message</span>
                 <span class="value">
-                  <gr-select
-                        id="useSignedOffBySelect"
-                        bind-value="{{_repoConfig.use_signed_off_by.configured_value}}">
-                    <select disabled$="[[_readOnly]]">
-                      <template is="dom-repeat"
-                          items="[[_formatBooleanSelect(_repoConfig.use_signed_off_by)]]">
+                  <gr-select id="useSignedOffBySelect" bind-value="{{_repoConfig.use_signed_off_by.configured_value}}">
+                    <select disabled\$="[[_readOnly]]">
+                      <template is="dom-repeat" items="[[_formatBooleanSelect(_repoConfig.use_signed_off_by)]]">
                         <option value="[[item.value]]">[[item.label]]</option>
                       </template>
                     </select>
@@ -360,18 +277,13 @@ limitations under the License.
                 </span>
               </section>
             </fieldset>
-            <div
-                class$="pluginConfig [[_computeHideClass(_pluginData)]]"
-                on-plugin-config-changed="_handlePluginConfigChanged">
+            <div class\$="pluginConfig [[_computeHideClass(_pluginData)]]" on-plugin-config-changed="_handlePluginConfigChanged">
               <h3>Plugins</h3>
               <template is="dom-repeat" items="[[_pluginData]]" as="data">
-                <gr-repo-plugin-config
-                    plugin-data="[[data]]"></gr-repo-plugin-config>
+                <gr-repo-plugin-config plugin-data="[[data]]"></gr-repo-plugin-config>
               </template>
             </div>
-            <gr-button
-                on-click="_handleSaveRepoConfig"
-                disabled$="[[_computeButtonDisabled(_readOnly, _configChanged)]]">Save changes</gr-button>
+            <gr-button on-click="_handleSaveRepoConfig" disabled\$="[[_computeButtonDisabled(_readOnly, _configChanged)]]">Save changes</gr-button>
           </fieldset>
           <gr-endpoint-decorator name="repo-config">
             <gr-endpoint-param name="repoName" value="[[repo]]"></gr-endpoint-param>
@@ -381,6 +293,4 @@ limitations under the License.
       </div>
     </main>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
-  </template>
-  <script src="gr-repo.js"></script>
-</dom-module>
+`;