TestMu 2025 - The Largest Virtual Software Testing Conference is Back | 50,000+ Attendees

How to use extendConfig method in backstopjs

Best JavaScript code snippet using backstopjs

index.js

1const {minGifImage, getSuffix, notBlank, getSuffixFromBuffer} = require('./utils')2module.exports = (ctx) => {3    const register = () => {4        ctx.helper.uploader.register('post-uploader', {5            handle,6            name: 'Postå¾åº',7            config: config8        });9    }10    const handle = async function (ctx) {11        let userConfig = ctx.getConfig('picBed.post-uploader');12        if (!userConfig) {13            throw new Error('Can\'t find uploader config');14        }15        //åå§åéç½®16        const url = userConfig.url;17        const paramName = userConfig.paramName;18        const urlFetcher = userConfig.urlFetcher;19        const extendConfig = JSON.parse(userConfig.extendConfig);20        try {21            let imgList = ctx.output;22            for (let i in imgList) {23                let img = imgList[i];24                let image = img.buffer;25                if (!image && img.base64Image) {26                    image = Buffer.from(img.base64Image, 'base64');27                } else if (extendConfig.enableImageMask !== false) {28                    // let suffix = getSuffixFromBuffer(image);29                    let suffix = getSuffix(img.fileName);30                    if (extendConfig.imageSuffixList === undefined) {31                        extendConfig.imageSuffixList = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'ico']32                    }33                    //éæå®åç¼34                    if (extendConfig.imageSuffixList.indexOf(suffix) === -1) {35                        if (extendConfig.headBase64 === undefined) {36                            extendConfig.headBase64 = minGifImage;37                        } else {38                            extendConfig.headBase64 = Buffer.from(extendConfig.headBase64, 'base64');39                        }40                        image = Buffer.concat([extendConfig.headBase64, image]);41                        ctx.log.info('>>>', 'éå¾çä¸ä¼ , å¤´é¨æ°å¢');42                        img.fileName = extendConfig.maskImageName || '1.gif';43                    }44                }45                const postConfig = postOptions(image, url, paramName, img.fileName, extendConfig)46                let response = await ctx.Request.request(postConfig)47                delete img.base64Image48                delete img.buffer49                if (!urlFetcher) {50                    img['imgUrl'] = response51                } else {52                    try {53                        if (urlFetcher[0] === '$') {54                            // eslint-disable-next-line no-eval55                            img['imgUrl'] = eval(urlFetcher.slice(1))56                        } else {57                            // eslint-disable-next-line no-eval58                            img['imgUrl'] = eval('JSON.parse(response).' + urlFetcher)59                        }60                    } catch (e) {61                        ctx.emit('notification', {62                            title: 'è¿åè§£æå¤±è´¥,è¯·æ£æ¥urlFetcherè®¾ç½®',63                            body: e + '\n' + response64                        })65                    }66                }67            }68        } catch (err) {69            ctx.emit('notification', {70                title: 'ä¸ä¼ å¤±è´¥',71                body: JSON.stringify(err)72            })73        }74    }75    const postOptions = (image, url, paramName, fileName, extendConfig) => {76        let headers = {77            contentType: 'multipart/form-data',78            'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.212 Safari/537.36'79        }80        if (extendConfig.extendHeader) {81            headers = Object.assign(headers, extendConfig.extendHeader)82        }83        let formData = {}84        if (extendConfig.extendForm) {85            formData = Object.assign(formData, extendConfig.extendForm)86        }87        const opts = {88            method: 'POST',89            url: url,90            headers: headers,91            formData: formData92        }93        opts.formData[paramName] = {}94        opts.formData[paramName].value = image95        opts.formData[paramName].options = {96            filename: fileName97        }98        return opts99    }100    const config = ctx => {101        let userConfig = ctx.getConfig('picBed.post-uploader')102        if (!userConfig) {103            userConfig = {}104        }105        return [106            {107                name: 'url',108                type: 'input',109                default: userConfig.url,110                required: true,111                message: 'ä¸ä¼ æ¥å£å°å',112                alias: 'ä¸ä¼ æ¥å£å°å'113            },114            {115                name: 'paramName',116                type: 'input',117                default: userConfig.paramName,118                required: true,119                message: 'æä»¶åæ®µå',120                alias: 'æä»¶åæ®µå'121            },122            {123                name: 'urlFetcher',124                type: 'input',125                default: userConfig.urlFetcher,126                required: false,127                message: 'å¾çURLè·å å¡«JSONè·¯å¾(eg: data.url)æevalè¡¨è¾¾å¼(eg: $"https://xxx/"+JSON.parse(response).data.uri)',128                alias: 'å¾çURLè·å'129            },130            {131                name: 'extendConfig',132                type: 'input',133                default: '{}',134                required: false,135                message: 'æ©å±éç½® æ åJSON(eg: {"key":"value"})',136                alias: 'æ©å±éç½®'137            }138        ]139    }140    return {141        uploader: 'post-uploader',142        register143    }...

index.ts

Source: index.ts

1import { SLIDER_TEMPLATE } from './template';2import { SliderManager } from './slider-manager';3export default class RangeSlider {4    private _button: any;5    /**6    * Plugin init7    * @function init8    * @param {Any} mapApi the viewer api9    */10    init(mapApi: any) {11        this.mapApi = mapApi;12        // create panel13        this.panel = this.mapApi.panels.create('rangeSlider');14        this.panel.element.css(RangeSlider.prototype.panelOptions);15        this.panel.body = SLIDER_TEMPLATE;16        // get slider configuration then add/merge needed configuration17        const config = this._RV.getConfig('plugins').rangeSlider;18        let extendConfig: any = {}19        if (typeof config !== 'undefined') {20            extendConfig = { ...RangeSlider.prototype.layerOptions, ...config.params };21            extendConfig.controls = config.controls;22            extendConfig.layers = config.layers;23            extendConfig.open = config.open;24        } else {25            extendConfig = RangeSlider.prototype.layerOptions;26        }27        extendConfig.language = this._RV.getCurrentLang();28        // side menu button29        this._button = this.mapApi.mapI.addPluginButton(30            RangeSlider.prototype.translations[this._RV.getCurrentLang()].title, this.onMenuItemClick()31        );32        if (extendConfig.open) { this._button.isActive = true; }33        // start slider creation34        new SliderManager(mapApi, this.panel, extendConfig);35    }36    /**37    * Event to fire on side menu item click. Open/Close the panel38    * @function onMenuItemClick39    * @return {function} the function to run40    */41   onMenuItemClick() {42        return () => {43            this._button.isActive = !this._button.isActive;44            this._button.isActive ? this.panel.open() : this.panel.close();45        };46    }47}48export default interface RangeSlider {49    mapApi: any,50    _RV: any,51    translations: any,52    panel: any,53    panelOptions: any,54    layerOptions: any55}56export interface Range {57    min: number,58    max: number59}60RangeSlider.prototype.panelOptions = {61    top: 'calc(100% - 235px)',62    height: '185px',63    'margin-right': '60px',64    'margin-left': '420px'65};66RangeSlider.prototype.layerOptions = {67    open: true,68    precision: 2,69    delay: 3000,70    lock: false,71    loop: false,72    export: false,73    range: { min: null, max: null },74    limit: { min: null, max: null },75    type: 'date',76    layers: [],77    controls: ['lock', 'loop', 'delay', 'refresh']78};79RangeSlider.prototype.translations = {80    'en-CA': {81        title: 'Range Slider',82        bar: {83            show: 'Show slider information',84            hide: 'Hide slider information',85            lock: 'Lock left anchor',86            unlock: 'Unlock left anchor',87            loop: 'Animate in loop',88            unloop: 'Do not animate in loop',89            previous: 'Previous',90            play: 'Play',91            pause: 'Pause',92            foward: 'Next',93            delay: 'Delay',94            refresh: 'Refresh',95            gif: 'GIF',96            tooltip: {97                gif: 'If enabled, click \"Play\" to start then \"Pause\" to finish then disable the control to export GIF'98            }99        }100    },101    'fr-CA': {102        title: 'Curseur de plage',103        bar: {104            show: 'Afficher l\'information du curseur de plage',105            hide: 'Cacher l\'information du curseur de plage',106            lock: 'Verrouiller la molette gauche',107            unlock: 'DÃ©verrouiller la molette gauche',108            loop: 'Animer en boucle',109            unloop: 'Ne pas animer en boucle',110            previous: 'PrÃ©cÃ©dent',111            play: 'Jouer',112            pause: 'Pause',113            foward: 'Prochain',114            delay: 'DÃ©lai',115            refresh: 'RafraÃ®chir',116            gif: 'GIF',117            tooltip: {118                gif: 'Si activÃ©, cliquez sur \"Jouer\" pour dÃ©marrer, puis sur \"Pause\" pour terminer et dÃ©sactiver le contrÃ´le pour exporter le GIF'119            }120        }121    }122};...

HeaderJoel.js

Source: HeaderJoel.js

1define(function() {2    return function(controller) {3        var HeaderJoel = new kony.ui.FlexContainer(extendConfig({4            "autogrowMode": kony.flex.AUTOGROW_NONE,5            "clipBounds": true,6            "isMaster": true,7            "height": "11.23%",8            "id": "HeaderJoel",9            "isVisible": true,10            "layoutType": kony.flex.FREE_FORM,11            "left": "0dp",12            "isModalContainer": false,13            "skin": "CopyslFbox0f3e5773cb44346",14            "top": "0dp",15            "width": "100%"16        }, controller.args[0], "HeaderJoel"), extendConfig({17            "retainFlowHorizontalAlignment": false18        }, controller.args[1], "HeaderJoel"), extendConfig({}, controller.args[2], "HeaderJoel"));19        HeaderJoel.setDefaultUnit(kony.flex.DP);20        var btnBack = new kony.ui.Image2(extendConfig({21            "height": "27dp",22            "id": "btnBack",23            "isVisible": false,24            "left": "2%",25            "onTouchStart": controller.AS_onClickBtnBack_d44e2cf05e894d328618834a60b5d12a,26            "skin": "CopyslImage0d2c6050fecc24b",27            "src": "back_button.png",28            "top": "20dp",29            "width": "50dp",30            "zIndex": 131        }, controller.args[0], "btnBack"), extendConfig({32            "imageScaleMode": constants.IMAGE_SCALE_MODE_MAINTAIN_ASPECT_RATIO,33            "padding": [0, 0, 0, 0],34            "paddingInPixel": false35        }, controller.args[1], "btnBack"), extendConfig({}, controller.args[2], "btnBack"));36        var imgLogo = new kony.ui.Image2(extendConfig({37            "height": "40dp",38            "id": "imgLogo",39            "isVisible": true,40            "left": "38%",41            "skin": "slImage",42            "src": "best_buy_logo.png",43            "top": "10dp",44            "width": "90dp",45            "zIndex": 146        }, controller.args[0], "imgLogo"), extendConfig({47            "imageScaleMode": constants.IMAGE_SCALE_MODE_MAINTAIN_ASPECT_RATIO,48            "padding": [0, 0, 0, 0],49            "paddingInPixel": false50        }, controller.args[1], "imgLogo"), extendConfig({}, controller.args[2], "imgLogo"));51        var btnSearch = new kony.ui.Image2(extendConfig({52            "height": "27dp",53            "id": "btnSearch",54            "isVisible": true,55            "onTouchStart": controller.AS_onClickBtnSearch_a76e84e9838c452aac0352e1b396e0dd,56            "right": "2%",57            "skin": "slImage",58            "src": "search_button.png",59            "top": "20dp",60            "width": "50dp",61            "zIndex": 162        }, controller.args[0], "btnSearch"), extendConfig({63            "imageScaleMode": constants.IMAGE_SCALE_MODE_MAINTAIN_ASPECT_RATIO,64            "padding": [0, 0, 0, 0],65            "paddingInPixel": false66        }, controller.args[1], "btnSearch"), extendConfig({}, controller.args[2], "btnSearch"));67        HeaderJoel.add(btnBack, imgLogo, btnSearch);68        return HeaderJoel;69    }...

Using AI Code Generation

1module.exports = {2    {3    },4    {5    },6    {7    },8    {9    },10    {11    }12    {13    },14    {15    },16    {17    },18    {19    },20    {21    },22    {

Using AI Code Generation

1module.exports = {2    {3    },4    {5    }6    {7    }8  "paths": {9  },10  "engineOptions": {11  },12}13- [BackstopJS](

Using AI Code Generation

1module.exports = {2 {3 },4 {5 },6 {7 }8 {9 }10 paths: {11 },12 engineOptions: {13 }14};

Using AI Code Generation

1module.exports = {2        {3        },4        {5        }6        {7        }8    paths: {9    },10    engineOptions: {11    },12};

Using AI Code Generation

1module.exports = {2 {3 }4 {5 }6 paths: {7 },8 engineOptions: {9 },10 engine_scripts: {11 },12};

Using AI Code Generation

1let config = {2    {3    },4    {5    },6    {7    },8    {9    }10    {11    }12  "paths": {13  },14  "engineOptions": {15  },16}17module.exports = config;

Using AI Code Generation

1const backstop = require('backstopjs');2const config = require('./backstop.json');3const argv = process.argv.slice(2);4const newConfig = require('./backstop-extended.json');5const fs = require('fs');6backstop('extendConfig', {7})8  .then(() => {9  })10  .catch((err) => {11    console.log(err);12  });13backstop('test', {14})15  .then(() => {16  })17  .catch((err) => {18    console.log(err);19  });20backstop('reference', {21})22  .then(() => {23  })24  .catch((err) => {25    console.log(err);26  });27backstop('approve', {28})29  .then(() => {30  })31  .catch((err) => {32    console.log(err);33  });

Using AI Code Generation

1const backstop = require('backstopjs');2const config = require('./backstop.json');3const args = process.argv.slice(2);4const scenario = args[0];5const reference = args[1];6const test = args[2];7const label = args[3];8if (scenario === 'all') {9    config.scenarios.forEach((scenario) => {10        backstop('reference', {11        }).then(() => {12            console.log('Reference done for ' + scenario.label);13            backstop('test', {14            }).then(() => {15                console.log('Test done for ' + scenario.label);16            }).catch((error) => {17                console.log(error);18            });19        }).catch((error) => {20            console.log(error);21        });22    });23} else {24    backstop('reference', {25    }).then(() => {26        console.log('Reference done for ' + label);27        backstop('test', {28        }).then(() => {29            console.log('Test done for ' + label);30        }).catch((error) => {31            console.log(error);32        });33    }).catch((error) => {34        console.log(error);35    });36}

Using AI Code Generation

1const config = require('../backstop/config.js');2const fs = require('fs');3const path = require('path');4const dirPath = path.join(__dirname, '../backstop/htmlFiles');5const files = fs.readdirSync(dirPath);6files.forEach((file) => {7  const filePath = path.join(dirPath, file);8  config.scenarios.push({9  });10});11fs.writeFileSync(12  path.join(__dirname, '../backstop/config.js'),13  `module.exports = ${JSON.stringify(config, null, 2)}`14);

Blogs

Check out the latest blogs from LambdaTest on this topic:

Digital transformation – part 3 – My view

Digital transformation - part 3

A Complete Guide To Flutter Testing

Mobile devices and mobile applications – both are booming in the world today. The idea of having the power of a computer in your pocket is revolutionary. As per Statista, mobile accounts for more than half of the web traffic worldwide. Mobile devices (excluding tablets) contributed to 54.4 percent of global website traffic in the fourth quarter of 2021, increasing consistently over the past couple of years.

Complete Tutorial On Appium Parallel Testing [With Examples]

In today’s fast-paced world, the primary goal of every business is to release their application or websites to the end users as early as possible. As a result, businesses constantly search for ways to test, measure, and improve their products. With the increase in competition, faster time to market (TTM) has become vital for any business to survive in today’s market. However, one of the possible challenges many business teams face is the release cycle time, which usually gets extended for several reasons.

Pair testing strategy in an Agile environment

Pair testing can help you complete your testing tasks faster and with higher quality. But who can do pair testing, and when should it be done? And what form of pair testing is best for your circumstance? Check out this blog for more information on how to conduct pair testing to optimize its benefits.

Getting Started with SpecFlow Actions [SpecFlow Automation Tutorial]

With the rise of Agile, teams have been trying to minimize the gap between the stakeholders and the development team.

Automation Testing Tutorials

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.