Skip to content


docs: updated README
Browse files Browse the repository at this point in the history
  • Loading branch information
ErikBjare committed Mar 24, 2021
1 parent 0414c7e commit 1bb7442
Show file tree
Hide file tree
Showing 2 changed files with 56 additions and 19 deletions.
2 changes: 1 addition & 1 deletion Makefile
Expand Up @@ -27,7 +27,7 @@ test:
npm test

testcafe firefox test/e2e/
npx testcafe firefox test/e2e/

rm -rf node_modules dist
Expand Down
73 changes: 55 additions & 18 deletions
@@ -1,34 +1,78 @@
# aw-webui

> A webui for ActivityWatch built in Vue.js
A web-based UI for ActivityWatch, built with Vue.js

[![Build Status](](
[![Coverage Status](](
[![Known Vulnerabilities](](

## Getting started

# update submodule
git submodule update --init --recursive

# install aw-client-js and aw-webui
make install
Getting started with setting up the development environment is pretty straight forward:

# Make sure you have aw-server running, the testing port will be used by default
# so make sure you are running with the --testing flag
# Start an instance of aw-server running in testing mode (on port 5666, with a separate database),
# This is what the web UI will connect to by default when run in development mode.
aw-qt --testing
# or, to run without watchers:
aw-server --testing

# Install dependencies
npm install
# or, to get exact versions of dependencies:
npm ci

# start aw-webui in dev mode
npm run serve

You might have to configure CORS for it to work, see the CORS section below.

You may also want to generate fake data so you have something to test with, see:

## Building

To build the production bundle, simply run the following:

# Install dependencies
npm ci

# Build for production
npm run build

### Using a pre-release with your main install

**Note:** Running a development version of aw-webui with an old aw-server can lead to issues due to version incompatibilities.

You can run a development version of aw-webui with your main version of ActivityWatch by building it (or fetching the latest build from CI) and replacing placing the contents of the `static` directory of your aw-server (or aw-server-rust) installation. For simplicity, back up the original directory for easier switching back.

The assets are stored in the following directories (relative to your installation directory), depending on if you use aw-server-python (default) or aw-server-rust:

- aw-server-python: `activitywatch/aw-server/aw_server/static/`
- aw-server-rust: `activitywatch/aw-server-rust/static/`

## Tests

Tests can be run with:

npm test

There are also E2E tests. You need to have an aw-server and the web UI running in development mode (with `npm run serve`, as instructed above). After you have that setup, you can run the tests with:

make test-e2e

## Development

### CORS

For development you'll also have to add/change CORS configuration in the
aw-server config by adding `cors_origins = http://localhost:27180` to your
For development, you'll also have to add/change CORS configuration in the
aw-server configs by adding `cors_origins = http://localhost:27180` to your
configuration file `~/.config/activitywatch/aw-server/aw-server.ini` under the
`server-testing` section.

Expand All @@ -37,10 +81,3 @@ configuration file `~/.config/activitywatch/aw-server/aw-server.ini` under the
One of the first things that happen in the application is the execution of `src/main.js`. This loads things such as bootstrap-vue and a bunch of other stuff that's globally used (filters, resources).

The main.js file then loads the `src/App.vue` file, which is the root component of the application.

## Building

# build for production
npm run build

0 comments on commit 1bb7442

Please sign in to comment.