fix(ui): prompts async methods + fixes

packages/@vue/cli-plugin-eslint/ui.js

@@ -1,3 +1,5 @@
+/* eslint-disable vue-libs/no-async-functions */
+
 module.exports = api => {
  // Config file
  api.describeConfig({
@@ -46,7 +48,8 @@ module.exports = api => {
  link: 'https://github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/html-end-tags.md',
  default: false,
  value: data.rules && data.rules['vue/html-end-tags'] === 'error',
- filter: input => JSON.stringify(input ? 'error' : 'off')
+ filter: input => JSON.stringify(input ? 'error' : 'off'),
+ transformer: input => input === JSON.stringify('error')
  },
  {
  name: 'vue/html-indent',
@@ -89,7 +92,8 @@ module.exports = api => {
  link: 'https://github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/html-self-closing.md',
  default: false,
  value: data.rules && data.rules['vue/html-self-closing'] === 'error',
- filter: input => JSON.stringify(input ? 'error' : 'off')
+ filter: input => JSON.stringify(input ? 'error' : 'off'),
+ transformer: input => input === JSON.stringify('error')
  },
  {
  name: 'vue/require-default-prop',
@@ -100,7 +104,8 @@ module.exports = api => {
  link: 'https://github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/require-default-prop.md',
  default: false,
  value: data.rules && data.rules['vue/require-default-prop'] === 'error',
- filter: input => JSON.stringify(input ? 'error' : 'off')
+ filter: input => JSON.stringify(input ? 'error' : 'off'),
+ transformer: input => input === JSON.stringify('error')
  },
  {
  name: 'vue/require-prop-types',
@@ -111,7 +116,8 @@ module.exports = api => {
  link: 'https://github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/require-prop-types.md',
  default: false,
  value: data.rules && data.rules['vue/require-prop-types'] === 'error',
- filter: input => JSON.stringify(input ? 'error' : 'off')
+ filter: input => JSON.stringify(input ? 'error' : 'off'),
+ transformer: input => input === JSON.stringify('error')
  },
  {
  name: 'vue/attributes-order',
@@ -122,7 +128,8 @@ module.exports = api => {
  link: 'https://github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/attributes-order.md',
  default: false,
  value: data.rules && data.rules['vue/attributes-order'] === 'error',
- filter: input => JSON.stringify(input ? 'error' : 'off')
+ filter: input => JSON.stringify(input ? 'error' : 'off'),
+ transformer: input => input === JSON.stringify('error')
  },
  {
  name: 'vue/html-quotes',
@@ -157,15 +164,17 @@ module.exports = api => {
  link: 'https://github.com/vuejs/eslint-plugin-vue/blob/master/docs/rules/order-in-components.md',
  default: false,
  value: data.rules && data.rules['vue/order-in-components'] === 'error',
- filter: input => JSON.stringify(input ? 'error' : 'off')
+ filter: input => JSON.stringify(input ? 'error' : 'off'),
+ transformer: input => input === JSON.stringify('error')
  }
  ]
  }),
- onWrite: ({ api, prompts }) => {
- api.setData(prompts.reduce((obj, prompt) => {
- obj[`rules.${prompt.id}`] = api.getAnswer(prompt.id, JSON.parse)
- return obj
- }, {}))
+ onWrite: async ({ api, prompts }) => {
+ const result = {}
+ for (const prompt of prompts) {
+ result[`rules.${prompt.id}`] = await api.getAnswer(prompt.id, JSON.parse)
+ }
+ api.setData(result)
  }
  })
 

packages/@vue/cli-shared-utils/lib/validate.js

@@ -16,3 +16,10 @@ exports.validate = (obj, schema, cb) => {
  }
  })
 }
+
+exports.validateSync = (obj, schema) => {
+ const result = joi.validate(obj, schema)
+ if (result.error) {
+ throw result.error
+ }
+}

packages/@vue/cli-ui/src/components/ConfigurationItem.vue

@@ -37,9 +37,18 @@ export default {
 
  computed: {
  iconClass () {
- return icons.getClassWithColor(this.configuration.icon || this.configuration.id) || 'gear-icon medium-blue'
+ return icons.getClassWithColor(this.getFileName(this.configuration.icon) || this.configuration.id) || 'gear-icon medium-blue'
  }
  },
+
+ methods: {
+ getFileName (icon) {
+ if (icon) {
+ if (!icon.includes('.')) return `f.${icon}`
+ return icon
+ }
+ }
+ }
 }
 </script>
 

packages/@vue/cli-ui/src/graphql-api/api/PluginApi.js

@@ -1,6 +1,10 @@
+const logs = require('../connectors/logs')
 const plugins = require('../connectors/plugins')
 const sharedData = require('../connectors/shared-data')
 const ipc = require('../utils/ipc')
+const { validate: validateConfig } = require('./configuration')
+const { validate: validateTask } = require('./task')
+const { validate: validateClientAddon } = require('./client-addon')
 
 class PluginApi {
  constructor (context) {
@@ -12,11 +16,31 @@ class PluginApi {
  }
 
  describeConfig (options) {
- this.configurations.push(options)
+ try {
+ validateConfig(options)
+ this.configurations.push(options)
+ } catch (e) {
+ logs.add({
+ type: 'error',
+ tag: 'PluginApi',
+ message: 'describeConfig options are invalid\n' +
+ e.message
+ }, this.context)
+ }
  }
 
  describeTask (options) {
- this.tasks.push(options)
+ try {
+ validateTask(options)
+ this.tasks.push(options)
+ } catch (e) {
+ logs.add({
+ type: 'error',
+ tag: 'PluginApi',
+ message: 'describeTask options are invalid\n' +
+ e.message
+ }, this.context)
+ }
  }
 
  getTask (command) {
@@ -26,7 +50,17 @@ class PluginApi {
  }
 
  addClientAddon (options) {
- this.clientAddons.push(options)
+ try {
+ validateClientAddon(options)
+ this.clientAddons.push(options)
+ } catch (e) {
+ logs.add({
+ type: 'error',
+ tag: 'PluginApi',
+ message: 'addClientAddon options are invalid\n' +
+ e.message
+ }, this.context)
+ }
  }
 
  ipcOn (cb) {

packages/@vue/cli-ui/src/graphql-api/api/client-addon.js

@@ -0,0 +1,11 @@
+const { createSchema, validateSync } = require('@vue/cli-shared-utils')
+
+const schema = createSchema(joi => ({
+ id: joi.string().required(),
+ path: joi.string(),
+ url: joi.string()
+}))
+
+exports.validate = (options) => {
+ validateSync(options, schema)
+}

packages/@vue/cli-ui/src/graphql-api/api/configuration.js

@@ -0,0 +1,21 @@
+const { createSchema, validateSync } = require('@vue/cli-shared-utils')
+
+const schema = createSchema(joi => ({
+ id: joi.string().required(),
+ name: joi.string().required(),
+ description: joi.string(),
+ link: joi.string().uri(),
+ icon: joi.string(),
+ files: joi.object({
+ json: joi.array().items(joi.string()),
+ js: joi.array().items(joi.string()),
+ yaml: joi.array().items(joi.string()),
+ package: joi.string()
+ }),
+ onRead: joi.func().required(),
+ onWrite: joi.func().required()
+}))
+
+exports.validate = (options) => {
+ validateSync(options, schema)
+}

packages/@vue/cli-ui/src/graphql-api/api/task.js

@@ -0,0 +1,22 @@
+const { createSchema, validateSync } = require('@vue/cli-shared-utils')
+
+const schema = createSchema(joi => ({
+ match: joi.object().type(RegExp).required().description('Match a npm script command'),
+ description: joi.string(),
+ link: joi.string().uri(),
+ prompts: joi.array(),
+ views: joi.array().items(joi.object({
+ id: joi.string().required(),
+ label: joi.string().required(),
+ icon: joi.string(),
+ component: joi.string().required()
+ })),
+ defaultView: joi.string(),
+ onBeforeRun: joi.func(),
+ onRun: joi.func(),
+ onExit: joi.func()
+}))
+
+exports.validate = (options) => {
+ validateSync(options, schema)
+}

packages/@vue/cli-ui/src/graphql-api/connectors/configurations.js

@@ -92,35 +92,35 @@ function writeData ({ config, data }, context) {
  }
 }
 
-function getPrompts (id, context) {
+async function getPrompts (id, context) {
  const config = findOne(id, context)
  if (config) {
  const data = readData(config, context)
  current = {
  config,
  data
  }
- const configData = config.onRead({
+ const configData = await config.onRead({
  data
  })
- prompts.reset()
+ await prompts.reset()
  configData.prompts.forEach(prompts.add)
  if (configData.answers) {
- prompts.setAnswers(configData.answers)
+ await prompts.setAnswers(configData.answers)
  }
- prompts.start()
+ await prompts.start()
  return prompts.list()
  }
  return []
 }
 
-function save (id, context) {
+async function save (id, context) {
  const config = findOne(id, context)
  if (config) {
  if (current.config === config) {
  const answers = prompts.getAnswers()
  let data = clone(current.data)
- config.onWrite({
+ await config.onWrite({
  prompts: prompts.list(),
  answers,
  data,
@@ -139,10 +139,10 @@ function save (id, context) {
  }
  })
  },
- getAnswer: (id, mapper) => {
+ getAnswer: async (id, mapper) => {
  const prompt = prompts.findOne(id)
  if (prompt) {
- const defaultValue = prompts.getDefaultValue(prompt)
+ const defaultValue = await prompts.getDefaultValue(prompt)
  if (defaultValue !== prompt.rawValue) {
  let value = get(answers, prompt.id)
  if (mapper) {

packages/@vue/cli-ui/src/graphql-api/connectors/logs.js

@@ -3,8 +3,9 @@ const { events } = require('@vue/cli-shared-utils/lib/logger')
 const { generateTitle } = require('@vue/cli/lib/util/clearConsole')
 // Subs
 const channels = require('../channels')
+// Context
+const getContext = require('../context')
 
-let init = false
 let logs = []
 
 exports.add = function (log, context) {
@@ -21,21 +22,6 @@ exports.add = function (log, context) {
  return item
 }
 
-exports.init = function (context) {
- if (!init) {
- init = true
- events.on('log', log => {
- exports.add(log, context)
- })
-
- exports.add({
- type: 'info',
- tag: null,
- message: generateTitle(true)
- }, context)
- }
-}
-
 exports.list = function (context) {
  return logs
 }
@@ -51,3 +37,17 @@ exports.clear = function (context) {
  logs = []
  return logs
 }
+
+// Init
+{
+ const context = getContext(null)
+ events.on('log', log => {
+ exports.add(log, context)
+ })
+
+ exports.add({
+ type: 'info',
+ tag: null,
+ message: generateTitle(true)
+ }, context)
+}

packages/@vue/cli-ui/src/graphql-api/connectors/plugins.js

@@ -272,7 +272,7 @@ function finishInstall (context) {
 }
 
 async function initPrompts (id, context) {
- prompts.reset()
+ await prompts.reset()
  try {
  let data = require(path.join(getPath(id), 'prompts.js'))
  if (typeof data === 'function') {
@@ -282,7 +282,7 @@ async function initPrompts (id, context) {
  } catch (e) {
  console.warn(`No prompts found for ${id}`)
  }
- prompts.start()
+ await prompts.start()
 }
 
 function update (id, context) {