Best JavaScript code snippet using qawolf
remove-unused-styles.spec.ts
Source:remove-unused-styles.spec.ts
...14 const css = removeUnusedStyles(config, usedSelectors, `15 [dir="ltr"] h1+h2 { font: used; }16 [dir="ltr"] h1+h3 { font: unused; }17 `);18 expectSelector(css, '[dir="ltr"] h1+h2');19 expectNoSelector(css, '[dir="ltr"] h1+h3');20 });21 it('should remove unused nested selectors', () => {22 const usedSelectors = new UsedSelectors(mockHtml(`23 <div>24 <button id="usedId" class="my-used" mph="88">Unused</button>25 </div>26 `));27 const css = removeUnusedStyles(config, usedSelectors, `28 div label { font: used; }29 div label#usedId { font: used; }30 div label#usedId.my-used { font: used; }31 div label#usedId.my-used[mph] { font: used; }32 `);33 expectNoSelector(css, 'label { font: used; }');34 expectNoSelector(css, 'div label { font: used; }');35 expectNoSelector(css, 'div label#usedId { font: used; }');36 expectNoSelector(css, 'div label#usedId.my-used { font: used; }');37 expectNoSelector(css, 'div label#usedId.my-used[mph] { font: used; }');38 });39 it('should keep used nested selectors', () => {40 const usedSelectors = new UsedSelectors(mockHtml(`41 <div>42 <label id="usedId" class="my-used" mph="88">Used</label>43 </div>44 `));45 const css = removeUnusedStyles(config, usedSelectors, `46 div { font: used; }47 label { font: used; }48 div label { font: used; }49 div label#usedId { font: used; }50 div label#usedId.my-used { font: used; }51 div label#usedId.my-used[mph] { font: used; }52 `);53 expectSelector(css, 'div { font: used; }');54 expectSelector(css, 'label { font: used; }');55 expectSelector(css, 'div label { font: used; }');56 expectSelector(css, 'div label#usedId { font: used; }');57 expectSelector(css, 'div label#usedId.my-used { font: used; }');58 expectSelector(css, 'div label#usedId.my-used[mph] { font: used; }');59 });60 it('should remove unused id selector', () => {61 const usedSelectors = new UsedSelectors(mockHtml(`62 <div>63 <label id="usedId">Used</label>64 <div id="another-UsedId">Used</div>65 </div>66 `));67 const css = removeUnusedStyles(config, usedSelectors, `68 label { font: used; }69 label#usedId { font: used; }70 label#unusedId { font: unused; }71 #another-UsedId { font: used; }72 #another-UnusedId { font: unused; }73 `);74 expectSelector(css, 'label { font: used; }');75 expectSelector(css, 'label#usedId');76 expectSelector(css, '#another-UsedId');77 expectNoSelector(css, 'label#unusedId');78 expectNoSelector(css, '#another-UnusedId');79 });80 it('should remove unused attr selector', () => {81 const usedSelectors = new UsedSelectors(mockHtml(`82 <label mph="88">Used</label>83 `));84 const css = removeUnusedStyles(config, usedSelectors, `85 label { font: used; }86 label[mph="88"] { font: used; }87 label[unused="val"] { font: unused; }88 `);89 expectSelector(css, 'label { font: used; }');90 expectSelector(css, 'label[mph="88"]');91 expectNoSelector(css, 'label[unused="val"]');92 });93 it('should remove unused tag selector', () => {94 const usedSelectors = new UsedSelectors(mockHtml(`95 <label class="div">Used</label>96 `));97 const css = removeUnusedStyles(config, usedSelectors, `98 div { font: unused }99 label { font: used }100 `);101 expectSelector(css, 'label');102 expectNoSelector(css, 'div');103 });104 it('should remove unused classname in multi-selector', () => {105 const usedSelectors = new UsedSelectors(mockHtml(`106 <div class="used-class"></div>107 `));108 const css = removeUnusedStyles(config, usedSelectors, `109 .unused-class, .unused-class2 { font: unused }110 .used-class { font: used }111 `);112 expectSelector(css, '.used-class');113 expectNoSelector(css, '.unused-class');114 expectNoSelector(css, '.unused-class2');115 });116 it('should remove unused classname', () => {117 const usedSelectors = new UsedSelectors(mockHtml(`118 <div class="used-class"></div>119 `));120 const css = removeUnusedStyles(config, usedSelectors, `121 .used-class { font: used }122 .unused-class { font: unused }123 `);124 expectSelector(css, '.used-class');125 expectNoSelector(css, '.unused-class');126 });127 function expectSelector(css: string, selector: string) {128 selector = selector.replace(/ \{ /g, '{')129 .replace(/ \} /g, '}')130 .replace(/\: /g, ':')131 .replace(/\; /g, ';');132 expect(css).toContain(selector);133 }134 function expectNoSelector(css: string, selector: string) {135 selector = selector.replace(/ \{ /g, '{')136 .replace(/ \} /g, '}')137 .replace(/\: /g, ':')138 .replace(/\; /g, ';');139 expect(css).not.toContain(selector);140 }141});
Navbar.test.jsx
Source:Navbar.test.jsx
...17 <Navbar {...defaultProps}>test</Navbar>,18 );19 },20 assert: () => {21 expectSelector('nav').toBeDefined();22 },23 });24 });25 it('expand not valid', () => {26 const { renderWrapped, expectSelector, execute } = TestRender();27 execute({28 act: () => {29 renderWrapped(30 <Navbar {...defaultProps} expand="invalid">test</Navbar>,31 );32 },33 assert: () => {34 expectSelector('nav').not.toHaveClass('navbar-expand-invalid');35 },36 });37 });38 it('expand xs', () => {39 const { renderWrapped, expectSelector, execute } = TestRender();40 execute({41 act: () => {42 renderWrapped(43 <Navbar {...defaultProps} expand="xs">test</Navbar>,44 );45 },46 assert: () => {47 expectSelector('nav').toHaveClass('navbar-expand-xs');48 expectSelector('nav').not.toHaveClass('navbar-expand-sm');49 expectSelector('nav').not.toHaveClass('navbar-expand-md');50 expectSelector('nav').not.toHaveClass('navbar-expand-lg');51 expectSelector('nav').not.toHaveClass('navbar-expand-xl');52 },53 });54 });55 it('expand sm', () => {56 const { renderWrapped, expectSelector, execute } = TestRender();57 execute({58 act: () => {59 renderWrapped(60 <Navbar {...defaultProps} expand="sm">test</Navbar>,61 );62 },63 assert: () => {64 expectSelector('nav').not.toHaveClass('navbar-expand-xs');65 expectSelector('nav').toHaveClass('navbar-expand-sm');66 expectSelector('nav').not.toHaveClass('navbar-expand-md');67 expectSelector('nav').not.toHaveClass('navbar-expand-lg');68 expectSelector('nav').not.toHaveClass('navbar-expand-xl');69 },70 });71 });72 it('expand md', () => {73 const { renderWrapped, expectSelector, execute } = TestRender();74 execute({75 act: () => {76 renderWrapped(77 <Navbar {...defaultProps} expand="md">test</Navbar>,78 );79 },80 assert: () => {81 expectSelector('nav').not.toHaveClass('navbar-expand-xs');82 expectSelector('nav').not.toHaveClass('navbar-expand-sm');83 expectSelector('nav').toHaveClass('navbar-expand-md');84 expectSelector('nav').not.toHaveClass('navbar-expand-lg');85 expectSelector('nav').not.toHaveClass('navbar-expand-xl');86 },87 });88 });89 it('expand lg', () => {90 const { renderWrapped, expectSelector, execute } = TestRender();91 execute({92 act: () => {93 renderWrapped(94 <Navbar {...defaultProps} expand="lg">test</Navbar>,95 );96 },97 assert: () => {98 expectSelector('nav').not.toHaveClass('navbar-expand-xs');99 expectSelector('nav').not.toHaveClass('navbar-expand-sm');100 expectSelector('nav').not.toHaveClass('navbar-expand-md');101 expectSelector('nav').toHaveClass('navbar-expand-lg');102 expectSelector('nav').not.toHaveClass('navbar-expand-xl');103 },104 });105 });106 it('expand xl', () => {107 const { renderWrapped, expectSelector, execute } = TestRender();108 execute({109 act: () => {110 renderWrapped(111 <Navbar {...defaultProps} expand="xl">test</Navbar>,112 );113 },114 assert: () => {115 expectSelector('nav').not.toHaveClass('navbar-expand-xs');116 expectSelector('nav').not.toHaveClass('navbar-expand-sm');117 expectSelector('nav').not.toHaveClass('navbar-expand-md');118 expectSelector('nav').not.toHaveClass('navbar-expand-lg');119 expectSelector('nav').toHaveClass('navbar-expand-xl');120 },121 });122 });123 it('color schema not valid', () => {124 const { renderWrapped, expectSelector, execute } = TestRender();125 execute({126 act: () => {127 renderWrapped(128 <Navbar {...defaultProps} colorSchema="invalid">test</Navbar>,129 );130 },131 assert: () => {132 expectSelector('nav').not.toHaveClass('navbar-invalid');133 expectSelector('nav').not.toHaveClass('bg-invalid');134 },135 });136 });137 it('color schema light', () => {138 const { renderWrapped, expectSelector, execute } = TestRender();139 execute({140 act: () => {141 renderWrapped(142 <Navbar {...defaultProps} colorSchema="light">test</Navbar>,143 );144 },145 assert: () => {146 expectSelector('nav').toHaveClass('navbar-light');147 expectSelector('nav').toHaveClass('bg-light');148 },149 });150 });151 it('color schema dark', () => {152 const { renderWrapped, expectSelector, execute } = TestRender();153 execute({154 act: () => {155 renderWrapped(156 <Navbar {...defaultProps} colorSchema="dark">test</Navbar>,157 );158 },159 assert: () => {160 expectSelector('nav').toHaveClass('navbar-dark');161 expectSelector('nav').toHaveClass('bg-dark');162 },163 });164 });...
Input.test.jsx
Source:Input.test.jsx
...10 <Input name="myInput" setFormData={jest.fn()} />,11 );12 },13 assert: () => {14 expectSelector('input').toBeDefined();15 },16 });17 });18 it('main class', () => {19 const { render, expectSelector, execute } = TestRender();20 execute({21 act: () => {22 render(23 <Input name="myInput" setFormData={jest.fn()} />,24 );25 },26 assert: () => {27 expectSelector('input').toHaveClass('form-control');28 },29 });30 });31 it('type text (default)', () => {32 const { render, expectSelector, execute } = TestRender();33 execute({34 act: () => {35 render(36 <Input name="myInput" setFormData={jest.fn()} />,37 );38 },39 assert: () => {40 expectSelector('input').toHaveAttribute('type', 'text');41 },42 });43 });44 it('type text', () => {45 const { render, expectSelector, execute } = TestRender();46 execute({47 act: () => {48 render(49 <Input name="myInput" setFormData={jest.fn()} type="text" />,50 );51 },52 assert: () => {53 expectSelector('input').toHaveAttribute('type', 'text');54 },55 });56 });57 it('type submit', () => {58 const { render, expectSelector, execute } = TestRender();59 execute({60 act: () => {61 render(62 <Input name="myInput" setFormData={jest.fn()} type="submit" />,63 );64 },65 assert: () => {66 expectSelector('input').toHaveAttribute('type', 'submit');67 },68 });69 });70 it('type password', () => {71 const { render, expectSelector, execute } = TestRender();72 execute({73 act: () => {74 render(75 <Input name="myInput" setFormData={jest.fn()} type="password" />,76 );77 },78 assert: () => {79 expectSelector('input').toHaveAttribute('type', 'password');80 },81 });82 });83 it('default value', () => {84 const { render, expectSelector, execute } = TestRender();85 execute({86 act: () => {87 render(88 <Input name="myInput" setFormData={jest.fn()} />,89 );90 },91 assert: () => {92 expectSelector('input').toHaveAttribute('value', '');93 },94 });95 });96 it('set value', () => {97 const { render, expectSelector, execute } = TestRender();98 execute({99 act: () => {100 render(101 <Input name="myInput" setFormData={jest.fn()} value="testValue" />,102 );103 },104 assert: () => {105 expectSelector('input').toHaveAttribute('value', 'testValue');106 },107 });108 });109 it('autoFocus not set', () => {110 const { render, expectSelector, execute } = TestRender();111 execute({112 act: () => {113 render(114 <Input name="myInput" setFormData={jest.fn()} />,115 );116 },117 assert: () => {118 expectSelector('input').not.toHaveFocus();119 },120 });121 });122 it('autoFocus set', () => {123 const { render, expectSelector, execute } = TestRender();124 execute({125 act: () => {126 render(127 <Input name="myInput" setFormData={jest.fn()} autoFocus />,128 );129 },130 assert: () => {131 expectSelector('input').toHaveFocus();132 },133 });134 });135 it('change value', () => {136 const {137 render, getSelector, execute,138 } = TestRender();139 const setFormData = jest.fn();140 execute({141 act: () => {142 render(143 <Input name="myInput" setFormData={setFormData} autoFocus />,144 );145 const input = getSelector('input');...
Button.test.jsx
Source:Button.test.jsx
...10 <Button />,11 );12 },13 assert: () => {14 expectSelector('button').toBeDefined();15 },16 });17 });18 it('main class', () => {19 const { render, expectSelector, execute } = TestRender();20 execute({21 act: () => {22 render(23 <Button />,24 );25 },26 assert: () => {27 expectSelector('button').toHaveClass('btn');28 },29 });30 });31 it('variety class', () => {32 const { render, expectSelector, execute } = TestRender();33 execute({34 act: () => {35 render(36 <Button variety="primary" />,37 );38 },39 assert: () => {40 expectSelector('button').toHaveClass('btn-primary');41 },42 });43 });44 it('variety class with outline', () => {45 const { render, expectSelector, execute } = TestRender();46 execute({47 act: () => {48 render(49 <Button variety="primary" outline />,50 );51 },52 assert: () => {53 expectSelector('button').toHaveClass('btn-outline-primary');54 },55 });56 });57 it('custom class', () => {58 const { render, expectSelector, execute } = TestRender();59 execute({60 act: () => {61 render(62 <Button className="myCustomClass" />,63 );64 },65 assert: () => {66 expectSelector('button').toHaveClass('myCustomClass');67 },68 });69 });70 it('type button', () => {71 const { render, expectSelector, execute } = TestRender();72 execute({73 act: () => {74 render(75 <Button />,76 );77 },78 assert: () => {79 expectSelector('button').toHaveAttribute('type', 'button');80 },81 });82 });83 it('type submit', () => {84 const { render, expectSelector, execute } = TestRender();85 execute({86 act: () => {87 render(88 <Button submit />,89 );90 },91 assert: () => {92 expectSelector('button').toHaveAttribute('type', 'submit');93 },94 });95 });96 it('disabled', () => {97 const { render, expectSelector, execute } = TestRender();98 execute({99 act: () => {100 render(101 <Button disabled />,102 );103 },104 assert: () => {105 expectSelector('button').toBeDisabled();106 },107 });108 });109 it('not disabled', () => {110 const { render, expectSelector, execute } = TestRender();111 execute({112 act: () => {113 render(114 <Button />,115 );116 },117 assert: () => {118 expectSelector('button').not.toBeDisabled();119 },120 });121 });122 it('autoFocus not set', () => {123 const { render, expectSelector, execute } = TestRender();124 execute({125 act: () => {126 render(127 <Button />,128 );129 },130 assert: () => {131 expectSelector('button').not.toHaveFocus();132 },133 });134 });135 it('autoFocus set', () => {136 const { render, expectSelector, execute } = TestRender();137 execute({138 act: () => {139 render(140 <Button autoFocus />,141 );142 },143 assert: () => {144 expectSelector('button').toHaveFocus();145 },146 });147 });148 it('click', () => {149 const {150 render, getSelector, execute,151 } = TestRender();152 const myClickFunc = jest.fn();153 execute({154 act: () => {155 render(156 <Button onClick={myClickFunc} />,157 );158 const button = getSelector('button');...
Using AI Code Generation
1const { expectSelector } = require("qawolf");2test("test", async () => {3 await expectSelector(".ButtonGroup--medium");4});5test("test", async () => {6 await expectSelector(".ButtonGroup--medium");7});8test("test", async () => {9 await expectSelector(".ButtonGroup--medium");10});11test("test", async () => {12 await expectSelector(".ButtonGroup--medium");13});14test("test", async () => {15 await expectSelector(".ButtonGroup--medium");16});17test("test", async () => {18 await expectSelector(".ButtonGroup--medium");19});20test("test", async () => {
Using AI Code Generation
1const { expectSelector } = require('qawolf');2const { selector } = require('qawolf');3const { expect } = require('chai');4describe('Login', () => {5 it('should login successfully', async () => {6 await page.type(selector('Email'), '
Using AI Code Generation
1const { expectSelector } = require("qawolf");2const { launch, navigate, stop } = require("qawolf");3describe("test", () => {4 let browser;5 beforeAll(async () => {6 });7 afterAll(async () => {8 await stop(browser);9 });10 it("test", async () => {11 await expectSelector(browser, "input[name='q']");12 });13});
Using AI Code Generation
1const { expectSelector } = require("qawolf");2expectSelector("input", { text: "Hello" });3const { expectSelector } = require("qawolf");4expectSelector("input", { text: "Hello" });5const { expectSelector } = require("qawolf");6expectSelector("input", { text: "Hello" });7const { expectSelector } = require("qawolf");8expectSelector("input", { text: "Hello" });9const { expectSelector } = require("qawolf");10expectSelector("input", { text: "Hello" });11const { expectSelector } = require("qawolf");12expectSelector("input", { text: "Hello" });13const { expectSelector } = require("qawolf");14expectSelector("input", { text: "Hello" });15const { expectSelector } = require("qawolf");16expectSelector("input", { text: "Hello" });17const { expectSelector } = require("qawolf");18expectSelector("input", { text: "Hello" });19const { expectSelector } = require("qawolf");20expectSelector("input", { text: "Hello" });21const { expectSelector } = require("qawolf");22expectSelector("input", { text: "Hello" });23const { expectSelector } = require("qawolf");24expectSelector("input", { text:
Using AI Code Generation
1const { expectSelector } = require("qawolf");2const { expect } = require("@jest/globals");3const { test, expect } = require('@playwright/test');4test('basic test', async ({ page }) => {5 await expectSelector(page, "input[name='q']");6});7test('basic test', async ({ page }) => {8 await expect(page).toHaveSelector("input[name='q']");9});10const { expectSelector } = require('qawolf');11test('basic test', async ({ page }) => {12 await expectSelector(page, "input[name='q']");13});14{15 "scripts": {16 },17 "devDependencies": {18 }19}20await expectSelector(page, "input[name='q']");
Using AI Code Generation
1const { expectSelector } = require('qawolf');2expectSelector('.selector').toExist();3const { expectSelector } = require('qawolf');4expectSelector('.selector').toExist();5const { expectSelector } = require('qawolf');6expectSelector('.selector').toExist();7const { expectSelector } = require('qawolf');8expectSelector('.selector').toExist();9const { expectSelector } = require('qawolf');10expectSelector('.selector').toExist();11const { expectSelector } = require('qawolf');12expectSelector('.selector').toExist();13const { expectSelector } = require('qawolf');14expectSelector('.selector').toExist();15const { expectSelector } = require('qawolf');16expectSelector('.selector').toExist();17const { expectSelector } = require('qawolf');18expectSelector('.selector').toExist();19const { expectSelector } = require('qawolf');20expectSelector('.selector').toExist();21const { expectSelector } = require('qawolf');22expectSelector('.selector').toExist();23const { expectSelector
Using AI Code Generation
1const { expectSelector } = require('qawolf');2await expectSelector(page, '.selector', { text: 'text' });3await expectSelector(page, '.selector', { text: 'text' }, { timeout: 10000 });4await expectSelector(page, '.selector', { text: 'text' }, { timeout: 10000 }, { interval: 100 });5await expectSelector(page, '.selector', { text: 'text' }, { timeout: 10000 }, { interval: 100 }, { ignore: 'ignore' });6await expectSelector(page, '.selector', { text: 'text' }, { timeout: 10000 }, { interval: 100 }, { ignore: 'ignore' }, { trim: true });7await expectSelector(page, '.selector', { text: 'text' }, { timeout: 10000 }, { interval: 100 }, { ignore: 'ignore' }, { trim: true }, { content: 'content' });8await expectSelector(page, '.selector', { text: 'text' }, { timeout: 10000 }, { interval: 100 }, { ignore: 'ignore' }, { trim: true }, { content: 'content' }, { tag: 'tag' });9await expectSelector(page, '.selector', { text: 'text' }, { timeout: 10000 }, { interval: 100 }, { ignore: 'ignore' }, { trim: true }, { content: 'content' }, { tag: 'tag' }, { visible: true });10await expectSelector(page, '.selector', { text: 'text' }, { timeout: 10000 }, { interval: 100 }, { ignore: 'ignore' }, { trim: true }, { content: 'content' }, { tag: 'tag' }, { visible: true }, { exact: true });11await expectSelector(page, '.selector', { text: 'text' }, { timeout: 10000 }, { interval: 100 }, { ignore: 'ignore
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!!