How to disable scroll actions for embedded Flutter web app?

Question

First question on SO - please be gentle.

I have a simple flutter web app that I'm embedding in an existing webpage. The app is hosted on firebase, and I'm using an iFrame on the parent page hosted separately to display the flutter app. Image below.

web page

The issue that I'm having is that whenever the pointer is over the iframe, the flutter app absorbs the scroll/wheel events, even if the app contains no scrollable content. I've tried just about everything I can research, from js scripts to iframe attributes to css. Nothing works. jQuery isn't accepted by the parent page either.

Here's the code I've tried on the parent web page - the console log events aren't being triggered (when using chrome dev tools at least) so I haven't attempted to pass the wheel event on to the parent as yet.

    <style>
 #app{
height: 280px;
 width: 90%;
 background-color: white;
 margin: 0 auto;
 border: none;
overflow-y: hidden;
 }
 </style>
<iframe id="app" src="https://fireball-apps-testimonials.firebaseapp.com/" scroll="no" scrolling="no"></iframe>
<script type="text/javascript">

var app = document.getElementById("app");
function myFunction(event) {
console.log('event triggered');
if (event) {
 if (event.wheelData< 0)
 {
 console.log('scrolling up');
 }
 else if (event.wheelData> 0)
 {
 console.log('scrolling down');
 }
}
else {
console.log('event is null');
}
}

app.addEventListener("wheel", myFunction);

</script>

Answer 1

I have tried many ways to disable scroll actions about CSS and Javascript on the parent web page. The problem is that Flutter listen to all scroll events, even when you have no scrollable widgets. So for the moment I have search the related code, to disable scroll actions:

1. Build your project with flutter build web
2. Open build/web/main.dart.js
3. Search and delete s.addEventListener.apply(s,["wheel",q,r])

Warning: It's not recommend to edit build files, but this is the only way I have found to disable scroll actions in the iFrame. When you delete the Event Listener you are not able to scroll in the iFrame and this workaround works only for desktop.

See https://github.com/flutter/flutter/issues/78216 for more information.