Watch scroll position not working

Good day people, i need help with triggering “onscroll” workflow and for some reason i can’t seem to trigger my onscroll workflow for my chat widget element.

im not using the page on scroll because we want to detect when user scrolls up, we load old data.

i’ve asked weweb AI and followed the instruction in detail but the onscroll is not firing, lease help

This is my UI hierarchy

and this is the UI

For those who’s facing the same issue, just avoid using weweb’s chat widget entirely because there is no way for you track scroll especially if you’re building a chat function like whatsapp

my solution is to ask the AI to just create a custom component based on AI chat widget with all the functionality we want.

Hi William, thank you for sharing a possible solution.

If indeed we are not able to track scroll with our native element, creating a new one from scratch is an excellent alternative.

I’d also consider using Cursor to create a powerful custom component and import it back to WeWeb.

Last week was my first time using that workflow, cursor to WeWeb, and it is a bit intimidating in the beginning but once you get past the setup it’s quite easy to use and extremely powerful (addicting as well haha)

Here’s a tutorial showing you how to get started:

1 Like

Three lines of code is all it takes. No fancy custom code, no AI.

https://6fc55c41-1522-419f-99f5-2c770459fa39.weweb-preview.io/scroll/

A. Workflow triggered by On mounted of the chat element

B. Global workflow to do whatever you need with the payload from the function (parameter must match the object’s key you pass into wwLib.executeWorkflow

const i = context.thisInstance;
const s = i.querySelector('.ww-chat__messages');

s.onscroll = e => wwLib.executeWorkflow('GLOBAL_WORKFLOW_ID', { scrollTop: e.target.scrollTop })
2 Likes

thanks bro!

okay will take a look, thanks agustin!

1 Like