powersync-ja/powersync.dart

Web support?

Closed this issue ยท 24 comments

Web is a key platform for my application and it's the main blocker for me switching to powersync right now! Thanks for the work team :)

@matthewwong525 Thanks for the feedback! Web support is on the way. We will post updates here once we have more specifics to share :)

@matthewwong525 quick question: Do you need support for Flutter for web, or for non-Flutter web apps?

Also, we'd love to talk to you for 5-10mins to hear more about your requirements and ask a couple of other questions. If you're open to this, could you drop me a line at conrad[at]powersync.co? Thanks!

@matthewwong525 quick question: Do you need support for Flutter for web, or for non-Flutter web apps?

Also, we'd love to talk to you for 5-10mins to hear more about your requirements and ask a couple of other questions. If you're open to this, could you drop me a line at conrad[at]powersync.co? Thanks!

My app uses flutter so I only need Flutter for web support. I don't think non-flutter web apps are part of it. For some context, I'm building a note-taking app that supports all platforms through Flutter.

Waiting updates on WEB support to plan using powersync ๐Ÿซ 

Waiting updates on WEB support to plan using powersync ๐Ÿซ 

Sit tight, we're working on it!

What's your web stack btw?

Waiting updates on WEB support to plan using powersync ๐Ÿซ 

Sit tight, we're working on it!

What's your web stack btw?

Using Flutter for both mobile and web applications of my project.

Hey everyone! I am pleased to share that we now have web support in an alpha release. It is open for anyone to try: https://www.powersync.com/blog/announcing-powersync-flutter-web-support

Hey guys! Please take into account that with the current alpha version PowerSyncDatabase.disconnectAndClear() functionality is not working as expected - during logout the data in tables is not deleted at all and can be accessed with different user session, which is a major issue.

Steps to reproduce:

  1. Login as User A to Supabase. Data(lists, todos) can be pre-created for illustration.
  2. Logout from Supabase. Call PowerSyncDatabase.disconnectAndClear().
  3. Login as User B to Supabase. Before the initial data will be downloaded for User B I'll see the data from previous session of User A.

@oleksiiparf thanks for reporting! We can confirm the issue and are working on a fix.

@oleksiiparf The disconnectAndClear issue was fixed here #66 and was published as version 1.3.0-apha.3 of the SDK.

First of all thank you for adding web support.
I am trying it out on my project and I wasn't able to get sync running at all.
After couple of hours for debugging what helped is disabling streaming requests (powersync-1.3.0-alpha.4/lib/src/database/web/web_powersync_database.dart:143).
I've tried alpha.4 and alpha.3, on Chrome 124.0.6367.118 and FF 126.0-2 . After setting requestStreaming to false for the StreamingSyncImplementation everything seem to look great both ways. Data changes in the server db is reflected in local and vice-versa.

Let me know if you need more info to replicate the case. I am running it as a local setup on Ubuntu in case this is relevant. Screenshot with the error:
Screenshot from 2024-05-26 17-38-54

Hi @morty29 , could you try to run our demo app and see whether you run into any issues with it? I suspect it will work for you, but if you could confirm that would help our investigation. then we can continue helping getting to the bottom of this.

Hi @morty29 Thanks for mentioning that updating streamRequests: false fixed the issue for you. After a quick investigation it seems like this setting is for streaming the outbound payload for HTTP requests, not inbound responses (which is what we need). We should be able to set this to false in the SDK - I tested with this setting and confirmed the incoming stream works correctly.

I have a suspicion this currently works in our demo app due to the version in the lockfile being fetch_client:1.0.2 while the PowerSync SDK requires the version range: fetch_client: ^1.0.2. Something might have changed in a later version of fetch_client. Although I did try updating to fetch_client:1.1.2 but also could not reproduce the error on my side.

Could you share what version of fetch_client is in you lockfiles? Could you also potentially try asserting fetch_client: 1.0.2 by adding it as a dependency to your project?

@kobiebotha Sure. I tried running the demo app, it fails with

powersync_web_worker:
Unhandled exception:
Exception: Could not compile worker: ../../../../../.pub-cache/git/drift-e37557b92e371748865e42468c3273b76fda89c8/drift/lib/src/web/wasm_setup/shared.dart:41:47:
Error: The argument type 'LegacySyncFileHandle' can't be assigned to the parameter type 'Object' because 'LegacySyncFileHandle' is nullable and 'Object' isn't.
 - 'Object' is from 'dart:core'.
    final getSizeResult = callMethod<Object?>(openedFile, 'getSize', []);
                                              ^
Error: Compilation failed.

#0      main (file:///.../dart/powersync.dart/packages/powersync_web_worker/bin/compile_webworker.dart:30:5)
<asynchronous suspension>

I tried locking sqlite3 at 2.4.2 and drift at 2.14.1 - didn't help.

@stevensJourney
Sure
Version that I were using to 1.0.2:

< fetch_api 1.0.3 (was 2.1.0) (2.2.0 available)
< fetch_client 1.0.2 (was 1.1.1) (from transitive dependency to direct dependency) (1.1.2 available)

And yes, it helped, so looks like some breaking change in the fetch_api indeed

@morty29 We've updated the monorepo to address the web worker compilation issue. We've also released 1.3.0-alpha.5 of the SDK package which no longer uses streamRequests: true. This should fix the issues you were experiencing. Thanks for the help with this issue.

I'm building a SaaS product that depends on Flutter web & PowerSync.

Flutter web + PowerSync still has the issue where multiple open tabs will cause sqlite to get messed up. Is there any expectations on when this will be resolved?

I'm also curious about timing on full wasm support for the Powersync flutter + drift. Right now we are using a work around to use Drift.

I'm happy to talk to anyone from Powersync if you want to know more about the use case, we have a team of devs involved.

Hi @AlmAnderson

We should now be able to merge web capabilities into sqlite_async.dart's main branch (with web support potentially in beta) which should allow using drift_sqlite_async in web. I suspect we should be able to prfioritize this to be released around next week if you require it urgently.

We are currently working on updating the powersync.dart Flutter web implementation to use our Rust SQLite extension which is currently used in the latest stable package. Once this is ready we will add web support (in beta) to thepowersync.dart latest stable package.

Multiple tab support will most likely be implemented shortly after the above has been completed.

@stevensJourney

We are currently in development and hope to use the product with our first private beta user (a company) within 2 weeks.

We were going to just hack in a way to disconnect multiple tabs that are open, but I haven't looked into that yet. Obviously not ideal but a temporary solution to the problem.

We are currently using drift separately and keeping the schema's in sync, which seems to be the only way to use a ORM atm.

So technically we have some work around options, it's just kind of tricky and painful until the new releases are done / full web support from PowerSync. In the mean time I would happily use a testing build that has any of the fixes in place. I think we are using Alpha 7 atm.

@stevensJourney

We are currently in development and hope to use the product with our first private beta user (a company) within 2 weeks.

We were going to just hack in a way to disconnect multiple tabs that are open, but I haven't looked into that yet. Obviously not ideal but a temporary solution to the problem.

We are currently using drift separately and keeping the schema's in sync, which seems to be the only way to use a ORM atm.

So technically we have some work around options, it's just kind of tricky and painful until the new releases are done / full web support from PowerSync. In the mean time I would happily use a testing build that has any of the fixes in place. I think we are using Alpha 7 atm.

Hi @AlmAnderson, just an update. We will release some intermediate multiple tab support fixes soon - see #119. There are some limitations to this work, but it should safeguard against corrupted databases.

Our Drift helper package doesn't yet work on web, but we aim to fix this by the end of the week.

Version v1.3.0-alpha.9 of the powersync package should be safer in multiple tab scenarios now.

@stevensJourney

Our Drift helper package doesn't yet work on web, but we aim to fix this by the end of the week.

Just checking in. Any progress on the package working for web? This is still a big blocker for us and it would be amazing if this started working with wasm.

I can't remember the details right now but it seemed like drift inside the package was an issue. I tried separating it and drift can work separately but then I'm not if that works as a work around. I'm assuming it won't?

@AlmAnderson Did you try the latest version with downloading the provided, necessary files for flutter web support?

See: https://docs.powersync.com/client-sdk-references/flutter/flutter-web-support-alpha

For me this works like a charm.

Yes, the latest packages should now have web support. I'm going to close this issue for now since it seems to be forking into multiple issues. Feel free to open separate issues if any new issues arise for web support.