Awesome
UI for Fn
Usage
Start an fn server
fn start
Start the UI:
docker run --rm -it --link fnserver:api -p 4000:4000 -e "FN_API_URL=http://api:8080" fnproject/ui
Screenshots
All apps view:
<img src="https://raw.githubusercontent.com/fnproject/ui/master/docs/screenshots/apps.png" width="800">All functions in an app:
<img src="https://raw.githubusercontent.com/fnproject/ui/master/docs/screenshots/routes.png" width="800">Development
Setup
1) Install dependencies
npm install
# if you want webpack globally
sudo npm install -g webpack@^1.14.0
2) Start Functions API (see Fn on GitHub)
fn start
3) Compile assets
# option 1: if global webpack
webpack
# option 2: if local webpack
npx webpack
4) Start web server
PORT=4000 FN_API_URL=http://localhost:8080 npm start
PORT
- port to run UI on. Optional, 4000 by defaultFN_API_URL
- Functions API URL. Required
5) View in browser
Configuring log levels
UI uses console-logging for server-side logging.
This supports log levels of debug
, verbose
, info
, warn
and error
. By default the log level is info
(this is configured in config/default.json
). To set a log level of debug
, use
NODE_CONFIG='{"logLevel":"debug"}' PORT=4000 FN_API_URL=http://localhost:8080 npm start
Automated Testing
Integration tests
The Fn UI has some basic Selenium integration tests that can be used to automatically test the UI's core functionality. These tests use the mocha
testing framework as the driver.
To run the tests:
1) Install the Chrome Driver
Download the ChromeDriver from Google and put it in a place which is in your path e.g. /usr/local/bin/chromedriver
.
2) Install the Node dev dependencies
Ensure you have the Node dev dependencies installed with:
npm install [--only dev]
3) Run the Fn interface
See the instructions above for how to start the Node webserver.
4) Configure your tests
Edit test_integration/etc/config.yaml accordingly e.g. point fn_url
to your Fn UI if you're not running it at its default location.
5) Run the tests
npm run test-integration