Add ShadowDOM tests for elements/edit/ components
Release-Notes: skip
Google-Bug-Id: b/238288621
Change-Id: I3148c96ee32b3f04d145953b10e92b92552bf786
diff --git a/polygerrit-ui/app/elements/edit/gr-default-editor/gr-default-editor_test.ts b/polygerrit-ui/app/elements/edit/gr-default-editor/gr-default-editor_test.ts
index 09b9013..bd69c7f 100644
--- a/polygerrit-ui/app/elements/edit/gr-default-editor/gr-default-editor_test.ts
+++ b/polygerrit-ui/app/elements/edit/gr-default-editor/gr-default-editor_test.ts
@@ -19,6 +19,12 @@
await flush();
});
+ test('render', () => {
+ expect(element).shadowDom.to.equal(/* HTML */ `
+ <textarea id="textarea"></textarea>
+ `);
+ });
+
test('fires content-change event', async () => {
const textarea = queryAndAssert<HTMLTextAreaElement>(element, '#textarea');
const promise = mockPromise();
diff --git a/polygerrit-ui/app/elements/edit/gr-edit-controls/gr-edit-controls_test.ts b/polygerrit-ui/app/elements/edit/gr-edit-controls/gr-edit-controls_test.ts
index 581c337..7c1a0ab 100644
--- a/polygerrit-ui/app/elements/edit/gr-edit-controls/gr-edit-controls_test.ts
+++ b/polygerrit-ui/app/elements/edit/gr-edit-controls/gr-edit-controls_test.ts
@@ -44,6 +44,143 @@
await element.updateComplete;
});
+ test('render', () => {
+ expect(element).shadowDom.to.equal(/* HTML */ `
+ <gr-button
+ aria-disabled="false"
+ id="open"
+ link=""
+ role="button"
+ tabindex="0"
+ >
+ Add/Open/Upload
+ </gr-button>
+ <gr-button
+ aria-disabled="false"
+ id="delete"
+ link=""
+ role="button"
+ tabindex="0"
+ >
+ Delete
+ </gr-button>
+ <gr-button
+ aria-disabled="false"
+ id="rename"
+ link=""
+ role="button"
+ tabindex="0"
+ >
+ Rename
+ </gr-button>
+ <gr-button
+ aria-disabled="false"
+ class="invisible"
+ id="restore"
+ link=""
+ role="button"
+ tabindex="0"
+ >
+ Restore
+ </gr-button>
+ <gr-overlay
+ aria-hidden="true"
+ id="overlay"
+ style="outline: none; display: none;"
+ tabindex="-1"
+ with-backdrop=""
+ >
+ <gr-dialog
+ class="dialog invisible"
+ confirm-label="Confirm"
+ confirm-on-enter=""
+ disabled=""
+ id="openDialog"
+ role="dialog"
+ >
+ <div class="header" slot="header">
+ Add a new file or open an existing file
+ </div>
+ <div class="main" slot="main">
+ <gr-autocomplete
+ placeholder="Enter an existing or new full file path."
+ >
+ </gr-autocomplete>
+ <div contenteditable="true" id="dragDropArea">
+ <p>Drag and drop a file here</p>
+ <p>or</p>
+ <p>
+ <iron-input>
+ <input
+ hidden=""
+ id="fileUploadInput"
+ multiple=""
+ type="file"
+ />
+ </iron-input>
+ <label for="fileUploadInput">
+ <gr-button
+ aria-disabled="false"
+ id="fileUploadBrowse"
+ role="button"
+ tabindex="0"
+ >
+ Browse
+ </gr-button>
+ </label>
+ </p>
+ </div>
+ </div>
+ </gr-dialog>
+ <gr-dialog
+ class="dialog invisible"
+ confirm-label="Delete"
+ confirm-on-enter=""
+ disabled=""
+ id="deleteDialog"
+ role="dialog"
+ >
+ <div class="header" slot="header">Delete a file from the repo</div>
+ <div class="main" slot="main">
+ <gr-autocomplete placeholder="Enter an existing full file path.">
+ </gr-autocomplete>
+ </div>
+ </gr-dialog>
+ <gr-dialog
+ class="dialog invisible"
+ confirm-label="Rename"
+ confirm-on-enter=""
+ disabled=""
+ id="renameDialog"
+ role="dialog"
+ >
+ <div class="header" slot="header">Rename a file in the repo</div>
+ <div class="main" slot="main">
+ <gr-autocomplete placeholder="Enter an existing full file path.">
+ </gr-autocomplete>
+ <iron-input id="newPathIronInput">
+ <input id="newPathInput" placeholder="Enter the new path." />
+ </iron-input>
+ </div>
+ </gr-dialog>
+ <gr-dialog
+ class="dialog invisible"
+ confirm-label="Restore"
+ confirm-on-enter=""
+ id="restoreDialog"
+ role="dialog"
+ >
+ <div class="header" slot="header">Restore this file?</div>
+ <div class="main" slot="main">
+ <iron-input>
+ <input />
+ </iron-input>
+ </div>
+ </gr-dialog>
+ </gr-overlay>
+ `);
+ });
+
test('all actions exist', () => {
// We take 1 away from the total found, due to an extra button being
// added for the file uploads (browse).
diff --git a/polygerrit-ui/app/elements/edit/gr-edit-file-controls/gr-edit-file-controls_test.ts b/polygerrit-ui/app/elements/edit/gr-edit-file-controls/gr-edit-file-controls_test.ts
index 8bba167..c6d7117 100644
--- a/polygerrit-ui/app/elements/edit/gr-edit-file-controls/gr-edit-file-controls_test.ts
+++ b/polygerrit-ui/app/elements/edit/gr-edit-file-controls/gr-edit-file-controls_test.ts
@@ -25,6 +25,14 @@
await element.updateComplete;
});
+ test('render', () => {
+ expect(element).shadowDom.to.equal(/* HTML */ `
+ <gr-dropdown down-arrow="" id="actions" link="" vertical-offset="20">
+ Actions
+ </gr-dropdown>
+ `);
+ });
+
test('open tap emits event', async () => {
const actions = queryAndAssert<GrDropdown>(element, '#actions');
element.filePath = 'foo';
diff --git a/polygerrit-ui/app/elements/edit/gr-editor-view/gr-editor-view_test.ts b/polygerrit-ui/app/elements/edit/gr-editor-view/gr-editor-view_test.ts
index 6dfbe00..48ce5ed8 100644
--- a/polygerrit-ui/app/elements/edit/gr-editor-view/gr-editor-view_test.ts
+++ b/polygerrit-ui/app/elements/edit/gr-editor-view/gr-editor-view_test.ts
@@ -43,6 +43,71 @@
await element.updateComplete;
});
+ test('render', () => {
+ expect(element).shadowDom.to.equal(/* HTML */ `
+ <div class="stickyHeader">
+ <header>
+ <span class="controlGroup">
+ <span> Edit mode </span>
+ <span class="separator"> </span>
+ <gr-editable-label
+ id="global"
+ labeltext="File path"
+ placeholder="File path..."
+ tabindex="0"
+ title="File path..."
+ >
+ </gr-editable-label>
+ </span>
+ <span class="controlGroup rightControls">
+ <gr-button
+ aria-disabled="false"
+ id="close"
+ link=""
+ role="button"
+ tabindex="0"
+ >
+ Cancel
+ </gr-button>
+ <gr-button
+ aria-disabled="true"
+ disabled=""
+ id="save"
+ link=""
+ primary=""
+ role="button"
+ tabindex="-1"
+ title="Save and Close the file"
+ >
+ Save
+ </gr-button>
+ <gr-button
+ aria-disabled="true"
+ disabled=""
+ id="publish"
+ link=""
+ primary=""
+ role="button"
+ tabindex="-1"
+ title="Publish your edit. A new patchset will be created."
+ >
+ Save & Publish
+ </gr-button>
+ </span>
+ </header>
+ </div>
+ <div class="textareaWrapper">
+ <gr-endpoint-decorator id="editorEndpoint" name="editor">
+ <gr-endpoint-param name="fileContent"> </gr-endpoint-param>
+ <gr-endpoint-param name="prefs"> </gr-endpoint-param>
+ <gr-endpoint-param name="fileType"> </gr-endpoint-param>
+ <gr-endpoint-param name="lineNum"> </gr-endpoint-param>
+ <gr-default-editor id="file"> </gr-default-editor>
+ </gr-endpoint-decorator>
+ </div>
+ `);
+ });
+
suite('paramsChanged', () => {
test('good params proceed', async () => {
changeDetailStub.returns(Promise.resolve({}));