Best JavaScript code snippet using storybook-root
mockImages.js
Source:mockImages.js
1export const defaultImage = {2 id: 'cpu1',3 title: {4 text: 'CPU使ç¨ç'5 },6 xAxis: [7 {8 type: 'category',9 boundaryGap: false,10 data: []11 }12 ],13 yAxis: [14 {15 type: 'value',16 max: 100,17 axisLabel: {18 formatter: '{value} %'19 }20 }21 ],22 series: [23 {24 type: 'liquidFill',25 data: [0.6]26 }27 ]28}29function newImage() {30 return JSON.parse(JSON.stringify(defaultImage));31}32export function generateImages(count) {33 const images = Array(count).fill({}).map(() => newImage());34 images.forEach((image, index) => image.id = `cpu${index}`);35 return images;36}37export function rnd(low, high, pre) {38 const update = Math.floor(Math.random() * (high - low + 1) + low) * (Math.random() * 2 < 1 ? -1 : 1) / 100;39 pre += update;40 if (pre < 0.05) pre += 0.05;41 if (pre > 1) pre += 0.05;42 return pre; 43}44const reducePercent = 0.4;45const increasePercent = 0.9;46function autoscalingImages(app) {47 // validate each image cpu status, if 48 const { selectService: { images: { optionsGo, optionsNode}}} = app;49 let scaleUp = optionsGo.some((option) => option.series[0].data[0] > increasePercent) 50 || optionsNode.some((option) => option.series[0].data[0] > increasePercent);51 let scaleDown = optionsGo.some((option) => option.series[0].data[0] < reducePercent) 52 || optionsNode.some((option) => option.series[0].data[0] < reducePercent);53 const { selectService: { maxCount, changePercent, flowRate } } = app;54 const maxGo = Math.floor(changePercent * maxCount / 100);55 const maxNode = Math.floor((100 - changePercent) * maxCount / 100);56 const goUsePercent = maxGo === 0? 0 : optionsGo.length / maxGo;57 const nodeUsePercent = maxNode === 0? 0 : optionsNode.length / maxNode;58 let needUpdate = false;59 if (scaleUp) {60 if (goUsePercent > nodeUsePercent && optionsNode.length < maxNode) {61 optionsNode.push(newImage());62 needUpdate = true;63 } else if (goUsePercent < nodeUsePercent && optionsGo.length < maxGo){64 optionsGo.push(newImage());65 needUpdate = true;66 } else if (optionsNode.length < maxNode) {67 optionsNode.push(newImage());68 needUpdate = true;69 } else if (optionsGo.length < maxGo) {70 optionsGo.push(newImage());71 needUpdate = true;72 }73 } else if (scaleDown) {74 if (goUsePercent > nodeUsePercent && optionsGo.length > 0) {75 optionsGo.shift();76 needUpdate = true;77 } else if (goUsePercent < nodeUsePercent && optionsNode.length > 0) {78 optionsNode.shift();79 needUpdate = true;80 } else if (optionsNode.length > 0) {81 optionsNode.shift();82 needUpdate = true;83 } else if (optionsGo.length > 0) {84 optionsGo.shift();85 needUpdate = true;86 }87 }88 if (needUpdate && (optionsGo.length !== 0 || optionsNode.length !== 0)) {89 const average = 0.8 * maxCount * flowRate / 100 / (optionsGo.length + optionsNode.length);90 optionsGo.forEach((image) => {91 image.series[0].data = [rnd(1, 5, average)];92 });93 optionsNode.forEach((image) => {94 image.series[0].data = [rnd(1, 5, average)];95 });96 }97}98export function connectComponent(app) {99 const updateCPUPercent = () => {100 app.selectService.images.optionsGo.forEach((option) => {101 option.series[0].data = [rnd(1, 5, option.series[0].data[0])];102 });103 app.selectService.images.optionsNode.forEach((option) => {104 option.series[0].data = [rnd(1, 5, option.series[0].data[0])];105 });106 autoscalingImages(app);107 };108 window.setInterval(updateCPUPercent.bind(app), 1000);109}110function generateNewImages(preImages, service, average, usePercent) {111 let increaseCount = 0;112 let decreaseCount = 0;113 preImages.forEach((image) => {114 image.series[0].data = [rnd(1, 5, average)];115 if (image.series[0].data[0] < reducePercent) {116 decreaseCount++;117 } else if (image.series[0].data[0] > increasePercent) {118 increaseCount++;119 }120 });121 const maxImage = Math.round(usePercent * service.maxCount);122 // each time only increase or reduce on machine123 if (preImages.length > maxImage) {124 preImages.splice(0, preImages.length - maxImage);125 }126 else if (increaseCount > 0 && preImages.length < maxImage) {127 preImages.push(JSON.parse(JSON.stringify(defaultImage)));128 } else if (decreaseCount > 0 && preImages.length > 0) {129 if (maxImage === 0) preImages.length = [];130 if (preImages.length > 0) preImages.shift();131 }132 return preImages;133}134// with change rate and flow rate, update current golang and nodejs service running status135export function updateImages(service) {136 // set max flow is 0.8 * service.maxCount137 const { flowRate } = service; 138 let preGolangImages = service.images.optionsGo;139 let preNodejsImages = service.images.optionsNode;140 let golangCount = preGolangImages.length;141 if (golangCount === 0 && service.changePercent > 0) {142 preGolangImages = [JSON.parse(JSON.stringify(defaultImage))];143 golangCount = 1;144 }145 let nodeCount = preNodejsImages.length; 146 if (nodeCount === 0 && service.changePercent < 100) {147 preNodejsImages = [JSON.parse(JSON.stringify(defaultImage))];148 nodeCount = 1;149 }150 const totalFlow = 0.8 * service.maxCount * flowRate / 100;151 let average = totalFlow / (golangCount + nodeCount);152 preGolangImages = generateNewImages(preGolangImages, service, average, service.changePercent / 100);153 preNodejsImages = generateNewImages(preNodejsImages, service, average, 1 - service.changePercent / 100);154 // update use percent155 average = totalFlow / (preGolangImages.length + preNodejsImages.length);156 preGolangImages.forEach((image) => {157 image.series[0].data = [rnd(1, 5, average)];158 });159 preNodejsImages.forEach((image) => {160 image.series[0].data = [rnd(1, 5, average)];161 });162 service.images.optionsGo = preGolangImages;163 service.images.optionsNode = preNodejsImages;164 return [preGolangImages, preNodejsImages];...
index.js
Source:index.js
1import { executeOnCreate, capitalize, snakeToTitle } from '../../util'2import Doctors from '../../doctors'3function init() {4 executeOnCreate('.invoice-add__body__items', addOptions)5 executeOnCreate('.invoice-metadata .wv-form-field:nth-child(4) > label > div', changePaymentDueTitle)6}7// Change Text8function changePaymentDueTitle (selector) {9 const pdue = document.querySelector(selector)10 pdue.innerText = 'Operation Date'11} 12// Surgery Options13const dataPoints = {}14function register (id) {15 dataPoints[id] = ''16}17function reactChange (data, key) {18 dataPoints[key] = data19 const textArea = document.querySelector('.invoice-memo .wv-textarea')20 if (textArea) {21 textArea.value = objectToString(dataPoints)22 }23}24function objectToString (obj) {25 let str = ''26 for (const key in obj) {27 if (obj.hasOwnProperty(key)) {28 if (obj[key]) {29 str = str + snakeToTitle(key) + ' - ' + obj[key] + '\n'30 }31 }32 }33 return str34}35function addOptions (selector) {36 const referenceNode = document.querySelector(selector)37 38 const optionsNode = document.createElement('div')39 optionsNode.className = '.surgery-options'40 optionsNode.style = 'padding-bottom: 10px;display:grid;grid-template-columns:1fr 1fr;'41 optionsNode.appendChild(options('operative-eye', ['Left', 'Right']))42 optionsNode.appendChild(options('surgeon', Doctors.map(d => d.name)))43 optionsNode.appendChild(input('biometry'))44 optionsNode.appendChild(input('addtional-details'))45 optionsNode.appendChild(input('left-eye-vision'))46 optionsNode.appendChild(input('right-eye-vision'))47 referenceNode.parentNode.insertBefore(optionsNode, referenceNode.nextSibling)48}49function options (id, list) {50 register(id)51 const btnGroup = document.createElement('div')52 btnGroup.id = id53 const title = document.createElement('h4')54 title.innerText = snakeToTitle(id)55 btnGroup.appendChild(title)56 57 list.forEach (op => {58 const btn = document.createElement('button')59 btn.className = 'wv-button--secondary'60 btn.innerText = capitalize(op)61 btnGroup.appendChild(btn)62 btn.addEventListener('click', () => {63 reactChange(op, id)64 const selectedBtn = document.querySelector(`#${id} .wv-button--primary`)65 if (selectedBtn) {66 selectedBtn.className = 'wv-button--secondary'67 }68 btn.className = 'wv-button--primary'69 })70 })71 return btnGroup72}73function input (id) {74 register(id)75 const inputGroup = document.createElement('div')76 inputGroup.id = id77 const title = document.createElement('h4')78 title.innerText = snakeToTitle(id)79 inputGroup.appendChild(title)80 const inp = document.createElement('input')81 inp.className = 'wv-input wv-input'82 inputGroup.appendChild(inp)83 inp.addEventListener('keyup', () => reactChange(inp.value, id))84 return inputGroup85}86export default {87 init...
types.ts
Source:types.ts
1import { TreeNode } from 'element-ui/types/tree';2export type AugmentedNode = TreeNode<string, OptionsNode>3export interface OptionsNode {4 value: string;5 label: string;6 linkedAnnotation: string | null;7 children?: OptionsNode[]8}9export interface Document {10 tree: OptionsNode[]11};12export interface NodeCommand {13 command: string;14 node: any;15 data: any;...
Using AI Code Generation
1import { optionsNode } from '@storybook/addon-options';2export default optionsNode({3 storySort: (a, b) => {4 if (a[1].kind === b[1].kind) {5 return 0;6 }7 return a[1].id.localeCompare(b[1].id, { numeric: true });8 },9});10import { configure } from '@storybook/react';11configure(require.context('../src', true, /\.stories\.js$/), module);12import '@storybook/addon-options/register';13import '@storybook/addon-knobs/register';14import '@storybook/addon-actions/register';15import '@storybook/addon-links/register';16import '@storybook/addon-a11y/register';17import '@storybook/addon-jest/register';18import '@storybook/addon-storysource/register';19import '@storybook/addon-viewport/register';20import '@storybook/addon-backgrounds/register';21import { addons } from '@storybook/addons';22import myTheme from './myTheme';23addons.setConfig({24});
Using AI Code Generation
1const optionsNode = require('storybook-root').optionsNode;2const options = optionsNode('test');3const options = require('storybook-root').options('test');4module.exports = {5 options: function(name) {6 return {7 }8 },9 optionsNode: function(name) {10 return {11 }12 }13}14module.exports = {15 options: function(name) {16 return {17 }18 },19 optionsNode: function(name) {20 return {21 }22 }23}24module.exports = {25 options: function(name) {26 return {27 }28 },29 optionsNode: function(name) {30 return {31 }32 }33}34module.exports = {35 options: function(name) {36 return {37 }38 },39 optionsNode: function(name) {40 return {41 }42 }43}44module.exports = {45 options: function(name) {46 return {47 }48 },49 optionsNode: function(name) {50 return {51 }52 }53}54module.exports = {55 options: function(name) {56 return {57 }58 },59 optionsNode: function(name) {60 return {61 }62 }63}64module.exports = {65 options: function(name) {66 return {67 }68 },69 optionsNode: function(name) {70 return {71 }72 }73}74module.exports = {75 options: function(name) {76 return {
Using AI Code Generation
1const optionsNode = require("storybook-root").optionsNode;2const options = optionsNode("storybook-root", "options");3const options = require("storybook-root").options("storybook-root", "options");4const options = require("storybook-root").options("storybook-root", "options", {5});6const options = require("storybook-root").options("storybook-root", "options", {7});8const options = require("storybook-root").options("storybook-root", "options", {9});10const options = require("storybook-root").options("storybook-root", "options", {11});12const options = require("storybook-root").options("storybook-root", "options", {13});14const options = require("storybook-root").options("storybook-root", "options", {15});16const options = require("storybook-root").options("storybook-root", "options", {17});18const options = require("storybook-root").options("storybook-root", "options", {19});20const options = require("storybook-root").options("storybook-root", "options", {21});22const options = require("storybook-root").options("storybook-root", "options", {23});24const options = require("storybook-root").options("storybook-root", "options", {25});26const optionsNode = require("storybook-root").optionsNode;27const options = optionsNode("storybook-root", "options");28const options = require("storybook-root").options("storybook-root", "options");
Using AI Code Generation
1const optionsNode = document.querySelector('storybook-root').optionsNode();2const options = JSON.parse(optionsNode.textContent);3console.log(options);4const optionsNode = document.querySelector('storybook-iframe').optionsNode();5const options = JSON.parse(optionsNode.textContent);6console.log(options);
Using AI Code Generation
1import React from 'react';2import { render } from 'react-dom';3import { storiesOf } from '@storybook/react';4import { withKnobs, text, boolean, number } from '@storybook/addon-knobs/react';5import { withOptions } from '@storybook/addon-options';6import { action } from '@storybook/addon-actions';7import { linkTo } from '@storybook/addon-links';8import { withInfo } from '@storybook/addon-info';9import { Welcome } from '@storybook/react/demo';10storiesOf('Welcome', module).add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);11storiesOf('Button', module)12 .addDecorator(withKnobs)13 .addDecorator(withOptions)14 .add(15 withInfo('A very simple component')(() => (16 <button onClick={action('clicked')}>{text('Label', 'Hello Button')}</button>17 .add(18 withInfo('A very simple component')(() => (19 <button onClick={action('clicked')}>20 {text('Label', '😀 😎 👍 💯')}21 );22storiesOf('withOptions', module).add(23 withInfo('A very simple component')(() => {24 const options = {
Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.
You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.
Get 100 minutes of automation test minutes FREE!!