bug #1079 [LiveComponent] Use display:revert for data-loading style (norkunas)

weaverryan · weaverryan · commit a005d2f282ae · 2023-08-30T10:35:43.000-04:00
This PR was merged into the 2.x branch. Discussion ---------- [LiveComponent] Use `display:revert` for `data-loading` style | Q | A | ------------- | --- | Bug fix? | yes | New feature? | no | Tickets | N/A | License | MIT Using `display:inline-block` breaks the inner workings if for example `data-loading` was used on `<tr>` element, so the table row contents are incorrectly displayed. Commits ------- be4f285 [LiveComponent] Use `display:revert` for `data-loading` style
diff --git a/src/LiveComponent/assets/dist/live_controller.js b/src/LiveComponent/assets/dist/live_controller.js
@@ -2380,7 +2380,7 @@ class LoadingPlugin {
         return loadingDirectives;
     }
     showElement(element) {
-        element.style.display = 'inline-block';
+        element.style.display = 'revert';
     }
     hideElement(element) {
         element.style.display = 'none';
diff --git a/src/LiveComponent/assets/src/Component/plugins/LoadingPlugin.ts b/src/LiveComponent/assets/src/Component/plugins/LoadingPlugin.ts
@@ -173,7 +173,7 @@ export default class implements PluginInterface {
     }
 
     private showElement(element: HTMLElement|SVGElement) {
-        element.style.display = 'inline-block';
+        element.style.display = 'revert';
     }
 
     private hideElement(element: HTMLElement|SVGElement) {

Original file line number	Diff line number	Diff line change
`@@ -2380,7 +2380,7 @@ class LoadingPlugin {`
`2380`	`2380`	`return loadingDirectives;`
`2381`	`2381`	`}`
`2382`	`2382`	`showElement(element) {`
`2383`		`- element.style.display = 'inline-block';`
	`2383`	`+ element.style.display = 'revert';`
`2384`	`2384`	`}`
`2385`	`2385`	`hideElement(element) {`
`2386`	`2386`	`element.style.display = 'none';`
Original file line number	Diff line number	Diff line change
`@@ -173,7 +173,7 @@ export default class implements PluginInterface {`
`173`	`173`	`}`
`174`	`174`
`175`	`175`	`private showElement(element: HTMLElement\|SVGElement) {`
`176`		`- element.style.display = 'inline-block';`
	`176`	`+ element.style.display = 'revert';`
`177`	`177`	`}`
`178`	`178`
`179`	`179`	`private hideElement(element: HTMLElement\|SVGElement) {`