Remove `style-scope` from lit diff
This was removed while migrating gr-diff.ts to lit. The diff-row and
diff-section lit components were created before that. Thus we have to
catch up with such changes that have happened since April.
Release-Notes: skip
Google-Bug-Id: b/237393560
Change-Id: I3aecc2069dc51555e7e04694e3c1d282ae7062d9
diff --git a/polygerrit-ui/app/embed/diff/gr-context-controls/gr-context-controls-section_test.ts b/polygerrit-ui/app/embed/diff/gr-context-controls/gr-context-controls-section_test.ts
index 7f920d5..aa29ac3 100644
--- a/polygerrit-ui/app/embed/diff/gr-context-controls/gr-context-controls-section_test.ts
+++ b/polygerrit-ui/app/embed/diff/gr-context-controls/gr-context-controls-section_test.ts
@@ -29,33 +29,33 @@
<table>
<tbody>
<tr
- class="above contextBackground gr-diff side-by-side style-scope"
+ class="above contextBackground gr-diff side-by-side"
left-type="contextControl"
right-type="contextControl"
>
- <td class="blame gr-diff style-scope" data-line-number="0"></td>
- <td class="contextLineNum gr-diff style-scope"></td>
- <td class="gr-diff style-scope"></td>
- <td class="contextLineNum gr-diff style-scope"></td>
- <td class="gr-diff style-scope"></td>
+ <td class="blame gr-diff" data-line-number="0"></td>
+ <td class="contextLineNum gr-diff"></td>
+ <td class="gr-diff"></td>
+ <td class="contextLineNum gr-diff"></td>
+ <td class="gr-diff"></td>
</tr>
- <tr class="dividerRow gr-diff show-both style-scope">
- <td class="blame gr-diff style-scope" data-line-number="0"></td>
- <td class="gr-diff style-scope"></td>
- <td class="dividerCell gr-diff style-scope" colspan="3">
+ <tr class="dividerRow gr-diff show-both">
+ <td class="blame gr-diff" data-line-number="0"></td>
+ <td class="gr-diff"></td>
+ <td class="dividerCell gr-diff" colspan="3">
<gr-context-controls showconfig="both"> </gr-context-controls>
</td>
</tr>
<tr
- class="below contextBackground gr-diff side-by-side style-scope"
+ class="below contextBackground gr-diff side-by-side"
left-type="contextControl"
right-type="contextControl"
>
- <td class="blame gr-diff style-scope" data-line-number="0"></td>
- <td class="contextLineNum gr-diff style-scope"></td>
- <td class="gr-diff style-scope"></td>
- <td class="contextLineNum gr-diff style-scope"></td>
- <td class="gr-diff style-scope"></td>
+ <td class="blame gr-diff" data-line-number="0"></td>
+ <td class="contextLineNum gr-diff"></td>
+ <td class="gr-diff"></td>
+ <td class="contextLineNum gr-diff"></td>
+ <td class="gr-diff"></td>
</tr>
</tbody>
</table>
diff --git a/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-row.ts b/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-row.ts
index 2d42aec..2cf2da1 100644
--- a/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-row.ts
+++ b/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-row.ts
@@ -113,13 +113,13 @@
private renderInvisible() {
return html`
<tr>
- <td class="style-scope gr-diff blame"></td>
- <td class="style-scope gr-diff left"></td>
- <td class="style-scope gr-diff left content">
+ <td class="gr-diff blame"></td>
+ <td class="gr-diff left"></td>
+ <td class="gr-diff left content">
<div>${this.left?.text ?? ''}</div>
</td>
- <td class="style-scope gr-diff right"></td>
- <td class="style-scope gr-diff right content">
+ <td class="gr-diff right"></td>
+ <td class="gr-diff right content">
<div>${this.right?.text ?? ''}</div>
</td>
</tr>
diff --git a/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-row_test.ts b/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-row_test.ts
index 75214a8..4e8bb62 100644
--- a/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-row_test.ts
+++ b/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-row_test.ts
@@ -32,27 +32,25 @@
<table>
<tbody>
<tr
- class="diff-row gr-diff side-by-side style-scope"
+ class="diff-row gr-diff side-by-side"
left-type="both"
right-type="both"
tabindex="-1"
>
- <td class="blame gr-diff style-scope" data-line-number="1"></td>
- <td class="gr-diff left lineNum style-scope" data-value="1">
+ <td class="blame gr-diff" data-line-number="1"></td>
+ <td class="gr-diff left lineNum" data-value="1">
<button
- class="gr-diff left lineNumButton style-scope"
+ class="gr-diff left lineNumButton"
data-value="1"
tabindex="-1"
>
1
</button>
</td>
- <td
- class="both content gr-diff left no-intraline-info style-scope"
- >
+ <td class="both content gr-diff left no-intraline-info">
<div
aria-label="lorem ipsum"
- class="contentText gr-diff left style-scope"
+ class="contentText gr-diff left"
data-side="left"
>
<gr-diff-text>lorem ipsum</gr-diff-text>
@@ -61,21 +59,19 @@
<slot name="left-1"> </slot>
</div>
</td>
- <td class="gr-diff lineNum right style-scope" data-value="1">
+ <td class="gr-diff lineNum right" data-value="1">
<button
- class="gr-diff lineNumButton right style-scope"
+ class="gr-diff lineNumButton right"
data-value="1"
tabindex="-1"
>
1
</button>
</td>
- <td
- class="both content gr-diff no-intraline-info right style-scope"
- >
+ <td class="both content gr-diff no-intraline-info right">
<div
aria-label="lorem ipsum"
- class="contentText gr-diff right style-scope"
+ class="contentText gr-diff right"
data-side="right"
>
<gr-diff-text>lorem ipsum</gr-diff-text>
@@ -103,36 +99,34 @@
<table>
<tbody>
<tr
- class="diff-row gr-diff side-by-side style-scope"
+ class="diff-row gr-diff side-by-side"
left-type="blank"
right-type="add"
tabindex="-1"
>
- <td class="blame gr-diff style-scope" data-line-number="0"></td>
- <td class="gr-diff left style-scope"></td>
- <td class="blank gr-diff left no-intraline-info style-scope">
+ <td class="blame gr-diff" data-line-number="0"></td>
+ <td class="gr-diff left"></td>
+ <td class="blank gr-diff left no-intraline-info">
<div
aria-label=""
- class="contentText gr-diff left style-scope"
+ class="contentText gr-diff left"
data-side="left"
></div>
</td>
- <td class="gr-diff lineNum right style-scope" data-value="1">
+ <td class="gr-diff lineNum right" data-value="1">
<button
aria-label="1 added"
- class="gr-diff lineNumButton right style-scope"
+ class="gr-diff lineNumButton right"
data-value="1"
tabindex="-1"
>
1
</button>
</td>
- <td
- class="add content gr-diff no-intraline-info right style-scope"
- >
+ <td class="add content gr-diff no-intraline-info right">
<div
aria-label="lorem ipsum"
- class="contentText gr-diff right style-scope"
+ class="contentText gr-diff right"
data-side="right"
>
<gr-diff-text>lorem ipsum</gr-diff-text>
@@ -160,28 +154,26 @@
<table>
<tbody>
<tr
- class="diff-row gr-diff side-by-side style-scope"
+ class="diff-row gr-diff side-by-side"
left-type="remove"
right-type="blank"
tabindex="-1"
>
- <td class="blame gr-diff style-scope" data-line-number="1"></td>
- <td class="gr-diff left lineNum style-scope" data-value="1">
+ <td class="blame gr-diff" data-line-number="1"></td>
+ <td class="gr-diff left lineNum" data-value="1">
<button
aria-label="1 removed"
- class="gr-diff left lineNumButton style-scope"
+ class="gr-diff left lineNumButton"
data-value="1"
tabindex="-1"
>
1
</button>
</td>
- <td
- class="content gr-diff left no-intraline-info remove style-scope"
- >
+ <td class="content gr-diff left no-intraline-info remove">
<div
aria-label="lorem ipsum"
- class="contentText gr-diff left style-scope"
+ class="contentText gr-diff left"
data-side="left"
>
<gr-diff-text>lorem ipsum</gr-diff-text>
@@ -190,11 +182,11 @@
<slot name="left-1"> </slot>
</div>
</td>
- <td class="gr-diff right style-scope"></td>
- <td class="blank gr-diff no-intraline-info right style-scope">
+ <td class="gr-diff right"></td>
+ <td class="blank gr-diff no-intraline-info right">
<div
aria-label=""
- class="contentText gr-diff right style-scope"
+ class="contentText gr-diff right"
data-side="right"
></div>
</td>
diff --git a/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-section_test.ts b/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-section_test.ts
index 043cbde..363b001 100644
--- a/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-section_test.ts
+++ b/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-section_test.ts
@@ -42,29 +42,27 @@
<gr-diff-row class="left-1 right-1"> </gr-diff-row>
<gr-diff-row class="left-1 right-1"> </gr-diff-row>
<table>
- <tbody class="both gr-diff section style-scope">
+ <tbody class="both gr-diff section">
<tr
- class="diff-row gr-diff side-by-side style-scope"
+ class="diff-row gr-diff side-by-side"
left-type="both"
right-type="both"
tabindex="-1"
>
- <td class="blame gr-diff style-scope" data-line-number="1"></td>
- <td class="gr-diff left lineNum style-scope" data-value="1">
+ <td class="blame gr-diff" data-line-number="1"></td>
+ <td class="gr-diff left lineNum" data-value="1">
<button
- class="gr-diff left lineNumButton style-scope"
+ class="gr-diff left lineNumButton"
data-value="1"
tabindex="-1"
>
1
</button>
</td>
- <td
- class="both content gr-diff left no-intraline-info style-scope"
- >
+ <td class="both content gr-diff left no-intraline-info">
<div
aria-label="asdf"
- class="contentText gr-diff left style-scope"
+ class="contentText gr-diff left"
data-side="left"
>
<gr-diff-text></gr-diff-text>
@@ -73,21 +71,19 @@
<slot name="left-1"> </slot>
</div>
</td>
- <td class="gr-diff lineNum right style-scope" data-value="1">
+ <td class="gr-diff lineNum right" data-value="1">
<button
- class="gr-diff lineNumButton right style-scope"
+ class="gr-diff lineNumButton right"
data-value="1"
tabindex="-1"
>
1
</button>
</td>
- <td
- class="both content gr-diff no-intraline-info right style-scope"
- >
+ <td class="both content gr-diff no-intraline-info right">
<div
aria-label="asdf"
- class="contentText gr-diff right style-scope"
+ class="contentText gr-diff right"
data-side="right"
>
<gr-diff-text></gr-diff-text>
@@ -98,27 +94,25 @@
</td>
</tr>
<tr
- class="diff-row gr-diff side-by-side style-scope"
+ class="diff-row gr-diff side-by-side"
left-type="both"
right-type="both"
tabindex="-1"
>
- <td class="blame gr-diff style-scope" data-line-number="1"></td>
- <td class="gr-diff left lineNum style-scope" data-value="1">
+ <td class="blame gr-diff" data-line-number="1"></td>
+ <td class="gr-diff left lineNum" data-value="1">
<button
- class="gr-diff left lineNumButton style-scope"
+ class="gr-diff left lineNumButton"
data-value="1"
tabindex="-1"
>
1
</button>
</td>
- <td
- class="both content gr-diff left no-intraline-info style-scope"
- >
+ <td class="both content gr-diff left no-intraline-info">
<div
aria-label="qwer"
- class="contentText gr-diff left style-scope"
+ class="contentText gr-diff left"
data-side="left"
>
<gr-diff-text></gr-diff-text>
@@ -127,21 +121,19 @@
<slot name="left-1"> </slot>
</div>
</td>
- <td class="gr-diff lineNum right style-scope" data-value="1">
+ <td class="gr-diff lineNum right" data-value="1">
<button
- class="gr-diff lineNumButton right style-scope"
+ class="gr-diff lineNumButton right"
data-value="1"
tabindex="-1"
>
1
</button>
</td>
- <td
- class="both content gr-diff no-intraline-info right style-scope"
- >
+ <td class="both content gr-diff no-intraline-info right">
<div
aria-label="qwer"
- class="contentText gr-diff right style-scope"
+ class="contentText gr-diff right"
data-side="right"
>
<gr-diff-text></gr-diff-text>
@@ -152,27 +144,25 @@
</td>
</tr>
<tr
- class="diff-row gr-diff side-by-side style-scope"
+ class="diff-row gr-diff side-by-side"
left-type="both"
right-type="both"
tabindex="-1"
>
- <td class="blame gr-diff style-scope" data-line-number="1"></td>
- <td class="gr-diff left lineNum style-scope" data-value="1">
+ <td class="blame gr-diff" data-line-number="1"></td>
+ <td class="gr-diff left lineNum" data-value="1">
<button
- class="gr-diff left lineNumButton style-scope"
+ class="gr-diff left lineNumButton"
data-value="1"
tabindex="-1"
>
1
</button>
</td>
- <td
- class="both content gr-diff left no-intraline-info style-scope"
- >
+ <td class="both content gr-diff left no-intraline-info">
<div
aria-label="zxcv"
- class="contentText gr-diff left style-scope"
+ class="contentText gr-diff left"
data-side="left"
>
<gr-diff-text></gr-diff-text>
@@ -181,21 +171,19 @@
<slot name="left-1"> </slot>
</div>
</td>
- <td class="gr-diff lineNum right style-scope" data-value="1">
+ <td class="gr-diff lineNum right" data-value="1">
<button
- class="gr-diff lineNumButton right style-scope"
+ class="gr-diff lineNumButton right"
data-value="1"
tabindex="-1"
>
1
</button>
</td>
- <td
- class="both content gr-diff no-intraline-info right style-scope"
- >
+ <td class="both content gr-diff no-intraline-info right">
<div
aria-label="zxcv"
- class="contentText gr-diff right style-scope"
+ class="contentText gr-diff right"
data-side="right"
>
<gr-diff-text></gr-diff-text>
diff --git a/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-text_test.ts b/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-text_test.ts
index 9e8d735..6814fdf 100644
--- a/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-text_test.ts
+++ b/polygerrit-ui/app/embed/diff/gr-diff-builder/gr-diff-text_test.ts
@@ -8,7 +8,7 @@
import {GrDiffText} from './gr-diff-text';
import {fixture, html, assert} from '@open-wc/testing';
-const LINE_BREAK = '<span class="style-scope gr-diff br"></span>';
+const LINE_BREAK = '<span class="gr-diff br"></span>';
const TAB = '<span class="" style=""></span>';
@@ -82,7 +82,7 @@
'\t',
/* HTML */ `
<span
- class="style-scope gr-diff tab"
+ class="gr-diff tab"
style="tab-size: ${size}; -moz-tab-size: ${size};"
>
</span>
diff --git a/polygerrit-ui/app/embed/diff/gr-diff/gr-diff-utils.ts b/polygerrit-ui/app/embed/diff/gr-diff/gr-diff-utils.ts
index 1f54a89..8a17611 100644
--- a/polygerrit-ui/app/embed/diff/gr-diff/gr-diff-utils.ts
+++ b/polygerrit-ui/app/embed/diff/gr-diff/gr-diff-utils.ts
@@ -198,21 +198,15 @@
/**
* Simple helper method for creating element classes in the context of
- * gr-diff.
- *
- * We are adding 'style-scope', 'gr-diff' classes for compatibility with
- * Shady DOM. TODO: Is that still required??
- *
- * Otherwise this is just a super simple convenience function.
+ * gr-diff. This is just a super simple convenience function.
*/
export function diffClasses(...additionalClasses: string[]) {
- return ['style-scope', 'gr-diff', ...additionalClasses].join(' ');
+ return ['gr-diff', ...additionalClasses].join(' ');
}
/**
* Simple helper method for creating elements in the context of gr-diff.
- *
- * Otherwise this is just a super simple convenience function.
+ * This is just a super simple convenience function.
*/
export function createElementDiff(
tagName: string,