Merge pull request #322 from hzbhzb/fix/update_style_error

fix: Style didn't take effect and offsetLeftToScrollContainer value is calculated incorrectly
openwebf · Apr 19, 2023 · 86a82f8 · 86a82f8
2 parents 557e5f7 + 497adb4
commit 86a82f8
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 2 deletions.
diff --git a/integration_tests/snapshots/css/css-variables/css-variables.ts.73bbc1d01.png b/integration_tests/snapshots/css/css-variables/css-variables.ts.73bbc1d01.png
diff --git a/integration_tests/specs/css/css-variables/css-variables.ts b/integration_tests/specs/css/css-variables/css-variables.ts
@@ -70,7 +70,7 @@ describe('CSS Variables', () => {
       }
     `)
     );
-    
+
     document.body.appendChild(
       <div class='container'>
           <h2>The text should be green.</h2>
@@ -274,6 +274,26 @@ describe('CSS Variables', () => {
     });
   });
 
+  it('the text color should be green', async (done) => {
+
+      const div = document.createElement('div');
+      div.appendChild(document.createTextNode('Green Text'));
+      div.className = "textcolor";
+      document.body.appendChild(div);
+      const style = document.createElement('style');
+      document.head.appendChild(style);
+      style.appendChild(document.createTextNode(`
+        .textcolor {
+           color: green;
+         }
+      `));
+
+      requestAnimationFrame(async () => {
+        await snapshot();
+        done();
+      });
+    });
+
   function createStyle(text) {
     const style = document.createElement('style');
     style.appendChild(document.createTextNode(text));

diff --git a/webf/lib/src/css/positioned.dart b/webf/lib/src/css/positioned.dart
@@ -121,7 +121,7 @@ class CSSPositionedLayout {
     double childWidth = child.boxSize!.width;
     double scrollContainerWidth = scrollContainer.boxSize!.width;
     // Dynamic offset to scroll container
-    double offsetLeftToScrollContainer = childToScrollContainerOffset.dx - scrollContainer.scrollLeft;
+    double offsetLeftToScrollContainer = childToScrollContainerOffset.dx;
     double offsetRightToScrollContainer = scrollContainerWidth - childWidth - offsetLeftToScrollContainer;
     RenderStyle childRenderStyle = child.renderStyle;
     RenderStyle? scrollContainerRenderStyle = scrollContainer.renderStyle;

diff --git a/webf/lib/src/html/head.dart b/webf/lib/src/html/head.dart
@@ -250,6 +250,7 @@ class StyleElement extends Element {
       }
       if (_styleSheet != null) {
         ownerDocument.styleNodeManager.appendPendingStyleSheet(_styleSheet!);
+        ownerDocument.updateStyleIfNeeded();
       }
     }
   }