Description
When using ResizeObserver in Dart2 and compiling for release (i'm assuming it uses dart2js), it stops working. Have reproduced this issue in Dart 2.7.
ResizeObserver works when doing a regular webdev serve:
pub global run webdev serve web:9999
ResizeObserver stops working when building for release:
pub global run webdev build --output=web:build --release
Test HTML file to reproduce issue:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div class="div1" style="background-color: red">
<textarea style="padding: 10px; margin: 10px;">
TESTING
</textarea>
</div>
<div class="div2" style="background-color: blue">
.
</div>
<script defer src="bug_resize_observer.dart.js"></script>
</body>
</html>
Test Dart file to reproduce issue:
import "dart:html";
void main() {
final DivElement div1 = querySelector("div.div1");
final DivElement div2 = querySelector("div.div2");
final ResizeObserver divResizeObserver = ResizeObserver((List<ResizeObserverEntry> blah1, ResizeObserver blah2) {
print("inside divResizeObserverCallback");
for (ResizeObserverEntry entry in blah1) {
div2.style.height = "${entry.target.clientHeight}px";
}
});
divResizeObserver.observe(div1);
}
When doing a regular webdev serve, it works fine, when you do a build with release mode, the ResizeObserver stops working. It would seem that minification is breaking it.
DevMode working (resizing text area and the blue div resizes as well):
Release Mode not working (resizing text area and the blue div does nothing and errors appear in the console):
I've documented in a lot of detail the problem here and all the workarounds i've tried without success:
https://stackoverflow.com/questions/60620940/dart2s-resizeobserver-being-broken-by-dart-minifier