dart-lang / webdev

A CLI for Dart web development.
https://pub.dev/packages/webdev
212 stars 75 forks source link

feat: Chrome (extension) API into own package. #2039

Open jarrodcolburn opened 1 year ago

jarrodcolburn commented 1 year ago

Seeking Dart Version of Extension API. Specifically seeking help from Google to help wrap Chrome's js API.

I see that a subset of the Chrome API is being worked on in this repo, here chrome_api.dart

I found this after I similarly wrapped some of the Chrome API for this project a Chrome Extension that Generates a QR for the current tab using Chrome's Tab object.

qr-code-url-ext-demo

I actually started working on a repo to port more Chrome API, before I thought "hey this is a lot of hand jamming! Doesn't Google own the spec? Do they have it in json anywhere?"

Since Google maintains these reference docs for the API perhaps they could wrap them or provide and easy (json?) format for others to do so?

I believe the Dart Debug Extension could be even rewritten in Flutter (maybe after things slow down once v3 is released ).

My hope would be that doing so not only spurs the development of Flutter Chrome Extensions by the Community but that it in turn....

helps the development of the Dart Debug Extension. I believe that people who want to help develop Dart Tools want to help develop them using the Dart language. And I think there would be more community support on the DDExtension.

elliette commented 1 year ago

Hi @jarrodcolburn! Thanks for opening an issue. We have discussed creating a Dart package for the Chrome extension API. Unfortunately there hasn't been any bandwidth for that, but I will update here when that happens.

jarrodcolburn commented 1 year ago

@elliette Let me ask, "If I can... extract all the 'chrome' js calls that you are using in the Dart Debug Extension into the 'chromeapi' package, would you consider using that package as a dependency?"

If yes that is a possibility, is there anything you absolutely do (or don't) want to see in the 'chromeapi' package?

jarrodcolburn commented 7 months ago

@elliette since the dart team is moving along on the package:web. And there is a community plugin for package:chrome_extensions.

I took a shot at updating the Chrome extension to use both packages. Here's where I got...

https://github.com/jarrodcolburn/webdev/tree/package_web

I'm definitely stuck in a couple places.

jarrodcolburn commented 7 months ago

Disregard most of previous comment. I still think it's interesting that we can use the chrome_extension package. But the way I did it in that branch is mostly worthless. Adding a simple extension method addListener to (Event)Stream class to unpack the Events would accomplish 90%+ of what's needed to keep most code in extension package as is.

jarrodcolburn commented 7 months ago

So like for example, specifically chrome.runtime.onMessage'saddListener could be implemented by...

import 'dart:js_interop';

import 'package:chrome_extension/runtime.dart';

export 'package:chrome_extension/runtime.dart';

// Necessary workaround as `chrome_extension` isn't exposing `EventStream`
typedef EventStream<T> = Stream<T>;

extension OnMessageListener on EventStream<OnMessageEvent> {
  addListener(Function(Object?, MessageSender?, JSFunction?) listenToEvent) {
    listen((OnMessageEvent onMessageEvent) {
      final OnMessageEvent(:message, :sender, :sendResponse) = onMessageEvent;
      listenToEvent(message, sender, sendResponse);
    });
  }
}

Then a version of extension that allows generic events could be used to allow all EventStreams to map to addListener