From 6115ada43b44985456e48111f02068f85f919772 Mon Sep 17 00:00:00 2001 From: Nikolay Dozmorov Date: Fri, 11 Jun 2021 13:09:40 +0300 Subject: [PATCH] feat(plugins): add menu-bar extension point (#383) --- README.md | 6 ++- lib/constants/extension-points.js | 4 ++ lib/static/components/controls/menu-bar.js | 12 +++++- lib/static/components/section/body/index.js | 3 +- package-lock.json | 12 ++++-- package.json | 3 +- test/func/fixtures/.hermione.fixtures.js | 8 +++- .../menu-bar/lib/menu-bar-item.css | 3 ++ .../menu-bar/lib/menu-bar-item.jsx | 20 +++++++++ .../menu-bar/package.json | 7 +++ .../html-reporter-plugins/menu-bar/plugin.js | 1 + .../menu-bar/webpack.config.js | 40 ++++++++++++++++++ .../redux-with-server/package.json | 2 +- .../chrome/menu bar plugins clicked.png | Bin 0 -> 3892 bytes .../972e9ff/chrome/menu bar plugins.png | Bin 0 -> 192 bytes .../plugins/tests-menu-bar-plugin.hermione.js | 22 ++++++++++ 16 files changed, 131 insertions(+), 12 deletions(-) create mode 100644 lib/constants/extension-points.js create mode 100644 test/func/html-reporter-plugins/menu-bar/lib/menu-bar-item.css create mode 100644 test/func/html-reporter-plugins/menu-bar/lib/menu-bar-item.jsx create mode 100644 test/func/html-reporter-plugins/menu-bar/package.json create mode 100644 test/func/html-reporter-plugins/menu-bar/plugin.js create mode 100644 test/func/html-reporter-plugins/menu-bar/webpack.config.js create mode 100644 test/func/plugins/screens/3144090/chrome/menu bar plugins clicked.png create mode 100644 test/func/plugins/screens/972e9ff/chrome/menu bar plugins.png create mode 100644 test/func/plugins/tests-menu-bar-plugin.hermione.js diff --git a/README.md b/README.md index 2bb232bac..3493f1f1e 100644 --- a/README.md +++ b/README.md @@ -285,8 +285,10 @@ directory. } ``` - Currently the only registered extension points is `result` - allows to extend each test result; adds `resultId` and `testName` props to the plugin component. - + Currently, there are extension points: + * `result` - allows to extend each test result; adds `resultId` and `testName` props to the plugin component. + * `menu-bar` - allows to extend menu bar. + An extension point may be extended by more than one component. In that case order of components application is determined by `plugins` config order. Each following component is applied to all previously composed components at the extension point. * **customScripts** (optional) `function[]` - allows to add any scripts on the report html-page. Script will be executed immediately on page render. It can be helpful for adding some metrics or own extra functionality. diff --git a/lib/constants/extension-points.js b/lib/constants/extension-points.js new file mode 100644 index 000000000..c5600434e --- /dev/null +++ b/lib/constants/extension-points.js @@ -0,0 +1,4 @@ +'use strict'; + +export const RESULT = 'result'; +export const MENU_BAR = 'menu-bar'; diff --git a/lib/static/components/controls/menu-bar.js b/lib/static/components/controls/menu-bar.js index 0c59d3a90..5a577c161 100644 --- a/lib/static/components/controls/menu-bar.js +++ b/lib/static/components/controls/menu-bar.js @@ -5,6 +5,9 @@ import {connect} from 'react-redux'; import PropTypes from 'prop-types'; import {Dropdown} from 'semantic-ui-react'; import {isEmpty} from 'lodash'; +import ExtensionPoint from '../extension-point'; +import plugins from '../../modules/plugins'; +import {MENU_BAR} from '../../../constants/extension-points'; class MenuBar extends Component { static propTypes = {extraItems: PropTypes.object.isRequired}; @@ -20,7 +23,10 @@ class MenuBar extends Component { render() { const {extraItems} = this.props; - if (isEmpty(extraItems)) { + const hasMenuBarPlugins = plugins.getLoadedConfigs() + .some(e => e.point === MENU_BAR); + + if (isEmpty(extraItems) && !hasMenuBarPlugins) { return null; } @@ -28,7 +34,9 @@ class MenuBar extends Component {
- {this._getItems(extraItems)} + + {this._getItems(extraItems)} +
diff --git a/lib/static/components/section/body/index.js b/lib/static/components/section/body/index.js index a8f02791e..581c7034a 100644 --- a/lib/static/components/section/body/index.js +++ b/lib/static/components/section/body/index.js @@ -7,6 +7,7 @@ import ControlButton from '../../controls/control-button'; import Result from './result'; import * as actions from '../../../modules/actions'; import ExtensionPoint from '../../extension-point'; +import {RESULT} from '../../../../constants/extension-points'; class Body extends Component { static propTypes = { @@ -115,7 +116,7 @@ class Body extends Component { {this._addRetrySwitcher()} {this._addRetryButton()} - + diff --git a/package-lock.json b/package-lock.json index 3c1c1341c..4e47d56b4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -376,10 +376,6 @@ "fastq": "^1.6.0" } }, - "@scoped/html-reporter-redux-with-server-plugin": { - "version": "file:test/func/html-reporter-plugins/redux-with-server", - "dev": true - }, "@semantic-ui-react/event-stack": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/@semantic-ui-react/event-stack/-/event-stack-3.1.1.tgz", @@ -8903,10 +8899,18 @@ "version": "file:test/func/html-reporter-plugins/basic", "dev": true }, + "html-reporter-menu-bar-plugin": { + "version": "file:test/func/html-reporter-plugins/menu-bar", + "dev": true + }, "html-reporter-redux-plugin": { "version": "file:test/func/html-reporter-plugins/redux", "dev": true }, + "html-reporter-redux-with-server-plugin": { + "version": "file:test/func/html-reporter-plugins/redux-with-server", + "dev": true + }, "html-reporter-test-server": { "version": "file:test/func/hermione-plugins/html-reporter-test-server", "dev": true diff --git a/package.json b/package.json index 844a83ba9..754333eff 100644 --- a/package.json +++ b/package.json @@ -81,7 +81,6 @@ "devDependencies": { "@gemini-testing/react-lazily-render": "^1.2.1", "@gemini-testing/react-lazyload": "^2.3.2", - "@scoped/html-reporter-redux-with-server-plugin": "file:test/func/html-reporter-plugins/redux-with-server", "app-module-path": "^2.2.0", "babel-core": "^6.26.0", "babel-eslint": "^8.0.1", @@ -110,7 +109,9 @@ "hermione-global-hook": "^1.0.1", "hermione-headless-chrome": "0.0.2", "html-react-parser": "^0.4.0", + "html-reporter-redux-with-server-plugin": "file:test/func/html-reporter-plugins/redux-with-server", "html-reporter-basic-plugin": "file:test/func/html-reporter-plugins/basic", + "html-reporter-menu-bar-plugin": "file:test/func/html-reporter-plugins/menu-bar", "html-reporter-redux-plugin": "file:test/func/html-reporter-plugins/redux", "html-reporter-test-server": "file:test/func/hermione-plugins/html-reporter-test-server", "html-reporter-tester": "file:test/func/hermione-plugins/html-reporter-tester", diff --git a/test/func/fixtures/.hermione.fixtures.js b/test/func/fixtures/.hermione.fixtures.js index d8c9dd44a..4fe8579a5 100644 --- a/test/func/fixtures/.hermione.fixtures.js +++ b/test/func/fixtures/.hermione.fixtures.js @@ -72,7 +72,7 @@ module.exports = { position: 'after' }, { - name: '@scoped/html-reporter-redux-with-server-plugin', + name: 'html-reporter-redux-with-server-plugin', component: 'ColorBorder', point: 'result', position: 'after' @@ -81,6 +81,12 @@ module.exports = { name: 'html-reporter-redux-plugin', component: 'ColorBorder', position: 'before' + }, + { + name: 'html-reporter-menu-bar-plugin', + component: 'MenuBarItem', + position: 'after', + point: 'menu-bar' } ] }, diff --git a/test/func/html-reporter-plugins/menu-bar/lib/menu-bar-item.css b/test/func/html-reporter-plugins/menu-bar/lib/menu-bar-item.css new file mode 100644 index 000000000..03f3c14ea --- /dev/null +++ b/test/func/html-reporter-plugins/menu-bar/lib/menu-bar-item.css @@ -0,0 +1,3 @@ +.menu-item__link.menu-bar-item { + color: red; +} diff --git a/test/func/html-reporter-plugins/menu-bar/lib/menu-bar-item.jsx b/test/func/html-reporter-plugins/menu-bar/lib/menu-bar-item.jsx new file mode 100644 index 000000000..70bd85f6a --- /dev/null +++ b/test/func/html-reporter-plugins/menu-bar/lib/menu-bar-item.jsx @@ -0,0 +1,20 @@ +import './menu-bar-item.css'; + +export default ['react', 'semantic-ui-react', function(React, {Dropdown}, {pluginName}) { + class MenuBarItem extends React.Component { + // allow the component to be placed only on "menu-bar" extension point + static point = 'menu-bar'; + + render() { + return ( + + {pluginName} + + ); + } + } + + return { + MenuBarItem + }; +}]; diff --git a/test/func/html-reporter-plugins/menu-bar/package.json b/test/func/html-reporter-plugins/menu-bar/package.json new file mode 100644 index 000000000..fcf92bc46 --- /dev/null +++ b/test/func/html-reporter-plugins/menu-bar/package.json @@ -0,0 +1,7 @@ +{ + "name": "html-reporter-menu-bar-plugin", + "version": "0.1.0", + "scripts": { + "build": "webpack --config webpack.config.js" + } +} diff --git a/test/func/html-reporter-plugins/menu-bar/plugin.js b/test/func/html-reporter-plugins/menu-bar/plugin.js new file mode 100644 index 000000000..b83a3d43b --- /dev/null +++ b/test/func/html-reporter-plugins/menu-bar/plugin.js @@ -0,0 +1 @@ +__hermione_html_reporter_register_plugin__(function(t){function e(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return t[r].call(o.exports,o,o.exports,e),o.l=!0,o.exports}var n={};return e.m=t,e.c=n,e.d=function(t,n,r){e.o(t,n)||Object.defineProperty(t,n,{configurable:!1,enumerable:!0,get:r})},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},e.p="",e(e.s=40)}([function(t,e){var n=t.exports="undefined"!=typeof window&&window.Math==Math?window:"undefined"!=typeof self&&self.Math==Math?self:Function("return this")();"number"==typeof __g&&(__g=n)},function(t,e){var n=t.exports={version:"2.6.9"};"number"==typeof __e&&(__e=n)},function(t,e,n){var r=n(10),o=n(29),i=n(15),u=Object.defineProperty;e.f=n(3)?Object.defineProperty:function(t,e,n){if(r(t),e=i(e,!0),r(n),o)try{return u(t,e,n)}catch(t){}if("get"in n||"set"in n)throw TypeError("Accessors not supported!");return"value"in n&&(t[e]=n.value),t}},function(t,e,n){t.exports=!n(11)(function(){return 7!=Object.defineProperty({},"a",{get:function(){return 7}}).a})},function(t,e){var n={}.hasOwnProperty;t.exports=function(t,e){return n.call(t,e)}},function(t,e,n){var r=n(2),o=n(12);t.exports=n(3)?function(t,e,n){return r.f(t,e,o(1,n))}:function(t,e,n){return t[e]=n,t}},function(t,e){t.exports=function(t){return"object"==typeof t?null!==t:"function"==typeof t}},function(t,e,n){var r=n(54),o=n(17);t.exports=function(t){return r(o(t))}},function(t,e,n){var r=n(22)("wks"),o=n(14),i=n(0).Symbol,u="function"==typeof i;(t.exports=function(t){return r[t]||(r[t]=u&&i[t]||(u?i:o)("Symbol."+t))}).store=r},function(t,e,n){var r=n(0),o=n(1),i=n(28),u=n(5),f=n(4),c=function(t,e,n){var a,s,l,p=t&c.F,d=t&c.G,y=t&c.S,v=t&c.P,h=t&c.B,b=t&c.W,m=d?o:o[e]||(o[e]={}),g=m.prototype,_=d?r:y?r[e]:(r[e]||{}).prototype;d&&(n=e);for(a in n)(s=!p&&_&&void 0!==_[a])&&f(m,a)||(l=s?_[a]:n[a],m[a]=d&&"function"!=typeof _[a]?n[a]:h&&s?i(l,r):b&&_[a]==l?function(t){var e=function(e,n,r){if(this instanceof t){switch(arguments.length){case 0:return new t;case 1:return new t(e);case 2:return new t(e,n)}return new t(e,n,r)}return t.apply(this,arguments)};return e.prototype=t.prototype,e}(l):v&&"function"==typeof l?i(Function.call,l):l,v&&((m.virtual||(m.virtual={}))[a]=l,t&c.R&&g&&!g[a]&&u(g,a,l)))};c.F=1,c.G=2,c.S=4,c.P=8,c.B=16,c.W=32,c.U=64,c.R=128,t.exports=c},function(t,e,n){var r=n(6);t.exports=function(t){if(!r(t))throw TypeError(t+" is not an object!");return t}},function(t,e){t.exports=function(t){try{return!!t()}catch(t){return!0}}},function(t,e){t.exports=function(t,e){return{enumerable:!(1&t),configurable:!(2&t),writable:!(4&t),value:e}}},function(t,e){t.exports=!0},function(t,e){var n=0,r=Math.random();t.exports=function(t){return"Symbol(".concat(void 0===t?"":t,")_",(++n+r).toString(36))}},function(t,e,n){var r=n(6);t.exports=function(t,e){if(!r(t))return t;var n,o;if(e&&"function"==typeof(n=t.toString)&&!r(o=n.call(t)))return o;if("function"==typeof(n=t.valueOf)&&!r(o=n.call(t)))return o;if(!e&&"function"==typeof(n=t.toString)&&!r(o=n.call(t)))return o;throw TypeError("Can't convert object to primitive value")}},function(t,e){var n=Math.ceil,r=Math.floor;t.exports=function(t){return isNaN(t=+t)?0:(t>0?r:n)(t)}},function(t,e){t.exports=function(t){if(void 0==t)throw TypeError("Can't call method on "+t);return t}},function(t,e){t.exports={}},function(t,e,n){var r=n(10),o=n(53),i=n(23),u=n(21)("IE_PROTO"),f=function(){},c=function(){var t,e=n(30)("iframe"),r=i.length;for(e.style.display="none",n(58).appendChild(e),e.src="javascript:",t=e.contentWindow.document,t.open(),t.write("