From 7910ab4ca60187d2994eed27bc5ffd78fbb3db97 Mon Sep 17 00:00:00 2001 From: John Cowen Date: Tue, 12 Nov 2019 09:18:37 +0000 Subject: [PATCH] ui: [dev] Adds express middleware, removes need to run api dev server (#6750) * ui: Adds some express middleware, removes need to run api dev server @hashicorp/api-double comes with a basic express based server to run the API double. This uses the express based server that ember-cli includes and uses to run your app instead. Eventually this will be moved to the @hashicorp/ember-cli-api-double addon instead. * Adds `make start-consul` to ease running a dev UI against Consul itself --- ui-v2/.ember-cli | 3 +-- ui-v2/GNUmakefile | 3 +++ ui-v2/README.md | 21 ++++++++++++++++----- ui-v2/lib/startup/index.js | 29 +++++++++++++++++++++++++++++ ui-v2/package.json | 1 + 5 files changed, 50 insertions(+), 7 deletions(-) diff --git a/ui-v2/.ember-cli b/ui-v2/.ember-cli index cdbed3326d..ee64cfed2a 100644 --- a/ui-v2/.ember-cli +++ b/ui-v2/.ember-cli @@ -5,6 +5,5 @@ Setting `disableAnalytics` to true will prevent any data from being sent. */ - "disableAnalytics": false, - "proxy": "http://localhost:3000" + "disableAnalytics": false } diff --git a/ui-v2/GNUmakefile b/ui-v2/GNUmakefile index 621134a332..42c48a9060 100644 --- a/ui-v2/GNUmakefile +++ b/ui-v2/GNUmakefile @@ -29,6 +29,9 @@ build: deps start: deps yarn run start +start-consul: deps + yarn run start:consul + start-api: deps yarn run start:api diff --git a/ui-v2/README.md b/ui-v2/README.md index 851a2bbb15..3636d9197d 100644 --- a/ui-v2/README.md +++ b/ui-v2/README.md @@ -21,14 +21,11 @@ All tooling scripts below primarily use `make` which in turn call node package s ## Running / Development -The source code comes with a small server that runs enough of the consul API +The source code comes with a small development mode that runs enough of the consul API as a set of mocks/fixtures to be able to run the UI without having to run consul. -* `make start-api` or `yarn start:api` (this starts a Consul API double running -on http://localhost:3000) -* `make start` or `yarn start` to start the ember app that connects to the -above API double +* `make start` or `yarn start` to start the ember app * Visit your app at [http://localhost:4200](http://localhost:4200). To enable ACLs using the mock API, use Web Inspector to set a cookie as follows: @@ -51,6 +48,20 @@ CONSUL_NODE_CODE=1000 See `./node_modules/@hashicorp/consul-api-double` for more details. +If you wish to run the UI code against a running consul instance, uncomment the `proxy` +line in `.ember-cli` to point ember-cli to your consul instance. + +You can also run the UI against a normal Consul installation. + +`make start-consul` or `yarn run start:consul` will use the `CONSUL_HTTP_ADDR` +environment variable to locate the Consul installation. If that it not set +`start-consul` will use `http://localhost:8500`. + +Example usage: + +``` +CONSUL_HTTP_ADDR=http://10.0.0.1:8500 make start-consul +``` ### Code Generators diff --git a/ui-v2/lib/startup/index.js b/ui-v2/lib/startup/index.js index 27d4159046..7b7487112d 100644 --- a/ui-v2/lib/startup/index.js +++ b/ui-v2/lib/startup/index.js @@ -1,7 +1,36 @@ /* eslint-env node */ 'use strict'; +// +const $ = process.env; +const fs = require('fs'); +const path = require('path'); +const promisify = require('util').promisify; +const read = promisify(fs.readFile); +const apiDouble = require('@hashicorp/api-double'); + +const apiDoubleHeaders = require('@hashicorp/api-double/lib/headers'); +const cookieParser = require('cookie-parser'); +const bodyParser = require('body-parser'); +// module.exports = { name: 'startup', + serverMiddleware: function(server) { + // TODO: This should all be moved out into ember-cli-api-double + // and we should figure out a way to get to the settings here for + // so we can set this path name centrally in config + // TODO: undefined here is a possible faker salt that we should be able + // to pass in from ember serve/config somehow + const dir = path.resolve('./node_modules/@hashicorp/consul-api-double'); + const controller = apiDouble(undefined, dir, read, $, path.resolve); + [ + apiDoubleHeaders(), + cookieParser(), + bodyParser.text({ type: '*/*' }), + controller().serve, + ].reduce(function(app, item) { + return app.use(item); + }, server.app); + }, contentFor: function(type, config) { const vars = { appName: config.modulePrefix, diff --git a/ui-v2/package.json b/ui-v2/package.json index 45012742dc..c9c1c7ecea 100644 --- a/ui-v2/package.json +++ b/ui-v2/package.json @@ -19,6 +19,7 @@ "format:css": "prettier --write \"app/styles/**/*.*\"", "start": "ember serve --port=${EMBER_SERVE_PORT:-4200} --live-reload-port=${EMBER_LIVE_RELOAD_PORT:-7020}", "start:staging": "ember serve --port=${EMBER_SERVE_PORT:-4200} --live-reload-port=${EMBER_LIVE_RELOAD_PORT:-7020} --environment staging", + "start:consul": "ember serve --proxy=${CONSUL_HTTP_ADDR:-http://localhost:8500} --port=${EMBER_SERVE_PORT:-4200} --live-reload-port=${EMBER_LIVE_RELOAD_PORT:-7020}", "start:api": "api-double --dir ./node_modules/@hashicorp/consul-api-double", "test": "ember test --test-port=${EMBER_TEST_PORT:-7357}", "test:parallel": "EMBER_EXAM_PARALLEL=true ember exam --split=4 --parallel",