Wildcard

A prototype that maps website data to a table, enabling end users to modify and reprogram the site.

Early demo video: https://www.loom.com/share/cab62c8172404c39bebc4c511a60a389

To use Wildcard

Clone this repo locally.

Follow these instructions to install the cloned directory as an unpacked chrome extension.

To test whether it's working: try an Airbnb search; the table should appear at the bottom and you should be able to sort by price.

To develop on Wildcard

Wildcard is built in Typescript and uses yarn and rollup for packages and bundling.

Initial setup

Install dependencies:

• install yarn and rollup
• yarn install
• yarn global add concurrently

To get code changes to automatically update the extension in the browser:

• Install the Chrome Extension AutoReload as an unpacked extension from source.
• From the chrome://extensions page, click Details -> Extension Options, and change the Reload Method to "Manage API".

Dev workflow

Every time you develop, follow these steps. If a change you make isn't having an effect, it's probably related to these steps:

• yarn run dev to start a watcher that builds the project.
  • Compilation can take a few seconds. If a change isn't working, it might be that compilation didn't finish yet. (Improving compilation time is a todo; I think it's mostly time spent compiling Handsontable)

To test if you're able to make changes, try adding a console.log statement to a site adapter file like src/site_adapters/airbnb.ts and see if it works.

File layout

src/wildcard.ts contains the core framework.

Site adapters are in src/site_adapters. Cell editors are in src/cell_editors.