Added plugin support for adding new languages to code export. Supports

PR #734

Author: David Haeffner

docs/plugins/code-export.md

@@ -4,18 +4,39 @@ title: Code Export Plugin Support
 sidebar_label: Exporting Code
 ---
 
-The plugins API enables any Selenium IDE plugin to be export code in response to certain events (or "hooks").
+The plugins API enables any Selenium IDE plugin to export code for either:
+
+1. an existing language
+2. a new language
 
 ### Export config
 
-In your plugin manifest you'll need to specify that it exports languages, and for which ones.
+In your plugin manifest you'll need to specify that it exports languages.
+
+<u>Add to an existing language</u>
+
+To augment an existing language, use the `languages` key and specify which ones in an array.
 
 ```javascript
   "exports": {
     "languages": ["java-junit"]
   }
 ```
 
+The currently available language ids `"java-junit"`, `"javascript-mocha"`, and `"python-pytest"`.
+
+<u>Add a new language</u>
+
+To add a new language to code export, use the `vendor` key and specify your langauge in an object array.
+
+```javascript
+  "exports": {
+    "vendor": [{"your-language": "Your language"}]
+  }
+```
+
+The key is the ID which will be used in the export event. The value is the display name that will be used in the code export menu in the UI.
+
 ### Export event
 
 Selenium IDE sends the following event for each entity type, which your plugin can respond to for code export.
@@ -30,7 +51,7 @@ Selenium IDE sends the following event for each entity type, which your plugin c
 ```
 
 - `action` - `export`, indicating an action that requires code export
-- `entity`, the entity to export, can be `command` or any of [the hooks mentioned in the next section](code-export.md#hooks)
+- `entity`, the entity to export, can be `command`, any of [the hooks mentioned in the next section](code-export.md#hooks), or `vendor` if exporting a new language
 - `options` - metadata to help your plugin make more informed decisions about what to export (e.g., project, test name, suite name, etc.)
 
 ## Hooks
@@ -49,6 +70,8 @@ Code export is built around the notion of hooks, which offers entry points into
 
 ## Response
 
+### Add to an existing language
+
 To respond to an export event, call `sendResponse` along with the string you'd like to export. If there are multiple lines to your string, separate them with newline characters (e.g., `\n`).
 
 Or you can look into using the command object structure mentioned in the [code export getting started](introduction/code-export.md#2-update-the-locators-and-commands).
@@ -57,4 +80,16 @@ Or you can look into using the command object structure mentioned in the [code e
 sendResponse(`const myLibrary = require("my-library");`);
 ```
 
+### Add a new language
+
+In response to a `vendor` export event for your new language(s), your plugin needs to respond with the an object containing the keys `filename` and `body`.
+
+```javascript
+const payload = {
+  filename: 'test.js',
+  body: '// your final exported code\n// goes here\n// etc.'
+}
+sendResponse(payload)
+```
+
 

packages/selenium-ide/src/neo/code-export/index.js

@@ -20,6 +20,15 @@ import ModalState from '../stores/view/ModalState'
 import exporter from 'code-export'
 import { downloadUniqueFile } from '../IO/filesystem'
 import { normalizeTestsInSuite } from '../IO/normalize'
+import PluginManager from '../../plugin/manager'
+import { availableLanguages as languages } from 'code-export'
+const vendorLanguages = PluginManager.plugins.vendorLanguages
+
+export function availableLanguages() {
+  return Object.keys(vendorLanguages).length
+    ? { ...languages, ...vendorLanguages }
+    : languages
+}
 
 export async function exportCodeToFile(
   selectedLanguages,
@@ -30,22 +39,26 @@ export async function exportCodeToFile(
   const { url, tests } = project
   for (const language of selectedLanguages) {
     let emittedCode
-    if (test) {
-      emittedCode = await exporter.emit.test(language, {
-        url,
-        test,
-        tests,
-        project,
-        enableOriginTracing,
+    let options = {
+      url,
+      tests,
+      project,
+      enableOriginTracing,
+    }
+    options.test = test ? test : undefined
+    options.suite = suite ? normalizeTestsInSuite({ suite, tests }) : undefined
+    if (vendorLanguages.hasOwnProperty(language)) {
+      const result = await PluginManager.emitMessage({
+        action: 'export',
+        entity: 'vendor',
+        language,
+        options,
       })
+      emittedCode = result[0].response
+    } else if (test) {
+      emittedCode = await exporter.emit.test(language, options)
     } else if (suite) {
-      emittedCode = await exporter.emit.suite(language, {
-        url,
-        suite: normalizeTestsInSuite({ suite, tests }),
-        tests,
-        project,
-        enableOriginTracing,
-      })
+      emittedCode = await exporter.emit.suite(language, options)
     }
     if (emittedCode) downloadUniqueFile(emittedCode.filename, emittedCode.body)
   }

packages/selenium-ide/src/neo/components/Dialogs/Export/index.jsx

@@ -21,7 +21,7 @@ import Modal from '../../Modal'
 import DialogContainer from '../Dialog'
 import FlatButton from '../../FlatButton'
 import Checkbox from '../../Checkbox'
-import { availableLanguages } from 'code-export'
+import { availableLanguages } from '../../../code-export'
 import './style.css'
 
 export default class ExportDialog extends React.Component {
@@ -112,9 +112,10 @@ class ExportList extends React.Component {
     this.props.selectLanguage(e.target.checked, language)
   }
   render() {
+    const languages = availableLanguages()
     return (
       <ul className="languages">
-        {Object.keys(availableLanguages)
+        {Object.keys(languages)
           .sort()
           .map(language => (
             <li key={language} className="language">
@@ -126,7 +127,7 @@ class ExportList extends React.Component {
                 onChange={this.handleChange.bind(this, language)}
               />
               <label htmlFor={language}>
-                {availableLanguages[language].displayName}
+                {languages[language].displayName}
               </label>
             </li>
           ))}

packages/selenium-ide/src/plugin/manager.js

@@ -43,6 +43,7 @@ function RunCommand(id, command, target, value, options) {
 class PluginManager {
   constructor() {
     this.plugins = []
+    this.plugins.vendorLanguages = {}
     RegisterConfigurationHook(project => {
       return new Promise(res => {
         Promise.all(
@@ -82,6 +83,13 @@ class PluginManager {
       RegisterSuiteHook(this.emitSuite.bind(undefined, plugin))
       RegisterTestHook(this.emitTest.bind(undefined, plugin))
       if (plugin.exports) {
+        if (plugin.exports.vendor) {
+          plugin.exports.vendor.forEach(language => {
+            const id = Object.keys(language)[0]
+            const displayName = Object.values(language)[0]
+            this.plugins.vendorLanguages[id] = { displayName }
+          })
+        }
         plugin.exports.languages.forEach(language => {
           Object.keys(exporter.register).forEach(register => {
             if (register !== 'command') {