{"version":3,"file":"component---src-pages-devtools-for-web-examples-tsx-d6516df7b77f5bf7428c.js","mappings":"6LAIe,SAASA,IACtB,MAAM,gBAAEC,IAAoBC,EAAAA,EAAAA,KAItBC,EAAU,CACdC,QAAS,CACP,cACA,uBACA,IAPuBH,EAAgBI,QACzCC,IAAA,IAAC,oBAAEC,GAAqBD,EAAA,OAA6B,IAAxBC,CAA4B,IAMhCC,KAAIC,IAAA,IAAC,GAAEC,GAAID,EAAA,MAAK,WAAWC,GAAI,IAAEC,KAAK,YAC7DA,KAAK,UAGT,OAAOC,EAAAA,cAACC,EAAAA,EAAM,CAACC,WAAY,2BAA4BX,QAASA,GAClE,C,sGCwRA,MA1S6C,CAC3C,CACEY,KAAM,aACNC,SAAU,CACR,CACED,KAAM,UACNE,KAAM,CAAC,yBACPC,WACE,qFACFC,QAAS,2CACTC,KAAM,uBAER,CACEL,KAAM,aACNE,KAAM,CAAC,4BACPC,WACE,wFACFC,QAAS,2CACTC,KAAM,0BAER,CACEL,KAAM,wBACNE,KAAM,CAAC,4BACPC,WACE,8FACFC,QAAS,2CACTC,KAAM,0BAER,CACEL,KAAM,YACNE,KAAM,CAAC,2BACPC,WACE,uFACFC,QAAS,2CACTC,KAAM,yBAER,CACEL,KAAM,uBACNE,KAAM,CAAC,2BACPC,WACE,6FACFC,QAAS,2CACTC,KAAM,yBAER,CACEL,KAAM,6BACNE,KAAM,CAAC,yBACPC,WACE,yFACFC,QAAS,2CACTC,KAAM,qBAER,CACEL,KAAM,+BACNE,KAAM,CAAC,yBACPC,WACE,2FACFC,QAAS,2CACTC,KAAM,qBAER,CACEL,KAAM,yCACNE,KAAM,CAAC,yBACPC,WACE,oGACFC,QAAS,2CACTC,KAAM,qBAER,CACEL,KAAM,WACNE,KAAM,CAAC,gCACPC,WACE,yFACFC,QACE,mGACFC,KAAM,6BAER,CACEL,KAAM,cACNE,KAAM,CAAC,6BACPC,WACE,yFACFC,QAAS,2CACTC,KAAM,2BAER,CACEL,KAAM,cACNE,KAAM,CAAC,6BACPC,WACE,kGACFC,QAAS,2CACTC,KAAM,wBAER,CACEL,KAAM,yBACNE,KAAM,CAAC,6BACPC,WACE,+FACFC,QAAS,2CACTC,KAAM,0BAIZ,CACEL,KAAM,KACNC,SAAU,CACR,CACED,KAAM,SACNE,KAAM,CAAC,8BACPC,WACE,oFACFC,QAAS,sCACTC,KAAM,yBAER,CACEL,KAAM,QACNE,KAAM,CAAC,8BACPC,WACE,mFACFC,QAAS,sCACTC,KAAM,qBAER,CACEL,KAAM,WACNE,KAAM,CAAC,8BACPC,WACE,sFACFC,QAAS,sCACTC,KAAM,0BAIZ,CACEL,KAAM,MACNC,SAAU,CACR,CACED,KAAM,YACNE,KAAM,CAAC,qBACPC,WACE,4EACFC,QAAS,mCACTC,KAAM,yBAIZ,CACEL,KAAM,OACNC,SAAU,CACR,CACED,KAAM,yBACNE,KAAM,CAAC,uCACPC,WACE,2FACFC,QAAS,6CACTC,KAAM,yBAER,CACEL,KAAM,kBACNE,KAAM,CAAC,uCACPC,WACE,6FACFC,QAAS,6CACTC,KAAM,2BAER,CACEL,KAAM,eACNE,KAAM,CAAC,uCACPC,WACE,0FACFC,QAAS,wCACTC,KAAM,qBAER,CACEL,KAAM,gBACNE,KAAM,CAAC,uCACPC,WACE,2FACFC,QAAS,wCACTC,KAAM,sBAER,CACEL,KAAM,WACNE,KAAM,CAAC,uCACPC,WACE,sFACFC,QAAS,6CACTC,KAAM,wBAER,CACEL,KAAM,WACNE,KAAM,CAAC,uCACPC,WACE,2FACFC,QAAS,6CACTC,KAAM,wBAER,CACEL,KAAM,aACNE,KAAM,CAAC,+CACPC,WACE,wFACFC,QAAS,+CACTC,KAAM,0BAER,CACEL,KAAM,SACNE,KAAM,CAAC,uCACPC,WACE,oFACFC,QAAS,wCACTC,KAAM,wBAIZ,CACEL,KAAM,SACNC,SAAU,CACR,CACED,KAAM,SACNE,KAAM,CAAC,uBACPC,WACE,sFACFC,QAAS,wCACTC,KAAM,sBAER,CACEL,KAAM,SACNE,KAAM,CAAC,yBACPC,WACE,sFACFC,QAAS,4CACTC,KAAM,sBAER,CACEL,KAAM,WACNE,KAAM,CAAC,yBACPC,WACE,+FACFC,QAAS,0CACTC,KAAM,wBAER,CACEL,KAAM,QACNE,KAAM,CAAC,sBACPC,WACE,qFACFC,QAAS,uCACTC,KAAM,+BAER,C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","sources":["webpack://product-docs-site/./src/components/Search/SiteSearch.tsx","webpack://product-docs-site/./src/config/devtools-for-web-examples.ts","webpack://product-docs-site/./src/pages/devtools-for-web-examples.tsx"],"sourcesContent":["import React from 'react'\nimport Search from '.'\nimport useSiteMetadata from '../../hooks/use-site-metadata'\n\nexport default function SiteSearch() {\n  const { contentPackages } = useSiteMetadata()\n  const searchablePackages = contentPackages.filter(\n    ({ includeInSiteSearch }) => includeInSiteSearch === true\n  )\n  const options = {\n    filters: [\n      'language:en',\n      'isLatestVersion:true',\n      `(${searchablePackages.map(({ id }) => `product:${id}`).join(' OR ')})`,\n    ].join(' AND '),\n  }\n\n  return <Search modalTitle={'Search All Documentation'} options={options} />\n}\n","const data: DevToolsHTMLLanguageCategory[] = [\n  {\n    name: 'JavaScript',\n    examples: [\n      {\n        name: 'Cypress',\n        uses: ['@axe-devtools/cypress'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/cypress',\n        docsURL: '/devtools-html/4.0.0/en/node-cy-overview',\n        icon: '/images/cypress.svg',\n      },\n      {\n        name: 'Playwright',\n        uses: ['@axe-devtools/playwright'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/playwright',\n        docsURL: '/devtools-html/4.0.0/en/node-pl-overview',\n        icon: '/images/playwright.svg',\n      },\n      {\n        name: 'Playwright with Mocha',\n        uses: ['@axe-devtools/playwright'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/playwright-mocha',\n        docsURL: '/devtools-html/4.0.0/en/node-pl-overview',\n        icon: '/images/playwright.svg',\n      },\n      {\n        name: 'Puppeteer',\n        uses: ['@axe-devtools/puppeteer'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/puppeteer',\n        docsURL: '/devtools-html/4.0.0/en/node-pu-overview',\n        icon: '/images/puppeteer.svg',\n      },\n      {\n        name: 'Puppeteer with Mocha',\n        uses: ['@axe-devtools/puppeteer'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/puppeteer-mocha',\n        docsURL: '/devtools-html/4.0.0/en/node-pu-overview',\n        icon: '/images/puppeteer.svg',\n      },\n      {\n        name: 'React with Jest and Enzyme',\n        uses: ['@axe-devtools/browser'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/jest-enzyme',\n        docsURL: '/devtools-html/4.0.0/en/node-br-overview',\n        icon: '/images/react.svg',\n      },\n      {\n        name: 'React with Jest and ReactDOM',\n        uses: ['@axe-devtools/browser'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/jest-reactdom',\n        docsURL: '/devtools-html/4.0.0/en/node-br-overview',\n        icon: '/images/react.svg',\n      },\n      {\n        name: 'React, Jest, and React Testing Library',\n        uses: ['@axe-devtools/browser'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/jest-react-testing-lib',\n        docsURL: '/devtools-html/4.0.0/en/node-br-overview',\n        icon: '/images/react.svg',\n      },\n      {\n        name: 'TestCafe',\n        uses: ['@axe-devtools/script-builder'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/axeTestcafe',\n        docsURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/blob/main/Node/axeTestcafe/README.md',\n        icon: '/images/testcafe-logo.svg',\n      },\n      {\n        name: 'WebDriverIO',\n        uses: ['@axe-devtools/webdriverio'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/webdriverio',\n        docsURL: '/devtools-html/4.0.0/en/node-wi-overview',\n        icon: '/images/webdriverio.svg',\n      },\n      {\n        name: 'WebDriverJS',\n        uses: ['@axe-devtools/webdriverjs'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/webdriver.js_vanilla',\n        docsURL: '/devtools-html/4.0.0/en/node-wj-overview',\n        icon: '/images/selenium.svg',\n      },\n      {\n        name: 'WebDriverJS with Mocha',\n        uses: ['@axe-devtools/webdriverjs'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Node/webdriverjs-mocha',\n        docsURL: '/devtools-html/4.0.0/en/node-wj-overview',\n        icon: '/images/selenium.svg',\n      },\n    ],\n  },\n  {\n    name: 'C#',\n    examples: [\n      {\n        name: 'MSTest',\n        uses: ['Deque.AxeDevtools.Selenium'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/C%23/MSTest',\n        docsURL: '/devtools-html/4.0.0/en/cs-overview',\n        icon: '/images/microsoft.svg',\n      },\n      {\n        name: 'NUnit',\n        uses: ['Deque.AxeDevtools.Selenium'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/C%23/NUnit',\n        docsURL: '/devtools-html/4.0.0/en/cs-overview',\n        icon: '/images/nunit.svg',\n      },\n      {\n        name: 'Selenium',\n        uses: ['Deque.AxeDevtools.Selenium'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/C%23/Selenium',\n        docsURL: '/devtools-html/4.0.0/en/cs-overview',\n        icon: '/images/selenium.svg',\n      },\n    ],\n  },\n  {\n    name: 'CLI',\n    examples: [\n      {\n        name: 'Spec Mode',\n        uses: ['@axe-devtools/cli'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/CLI',\n        docsURL: '/devtools-html/4.0.0/en/cli-home',\n        icon: '/images/console.svg',\n      },\n    ],\n  },\n  {\n    name: 'Java',\n    examples: [\n      {\n        name: 'Cucumber PicoContainer',\n        uses: ['com.deque.html.axedevtools.cucumber'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Java/cucumber-pico',\n        docsURL: '/devtools-html/4.0.0/en/java-test-cucumber',\n        icon: '/images/pico-logo.png',\n      },\n      {\n        name: 'Cucumber Spring',\n        uses: ['com.deque.html.axedevtools.cucumber'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Java/cucumber-spring',\n        docsURL: '/devtools-html/4.0.0/en/java-test-cucumber',\n        icon: '/images/spring-icon.svg',\n      },\n      {\n        name: 'Gradle JUnit',\n        uses: ['com.deque.html.axedevtools.selenium'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Java/gradle-junit',\n        docsURL: '/devtools-html/4.0.0/en/java-overview',\n        icon: '/images/junit.svg',\n      },\n      {\n        name: 'Gradle TestNG',\n        uses: ['com.deque.html.axedevtools.selenium'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Java/gradle-testng',\n        docsURL: '/devtools-html/4.0.0/en/java-overview',\n        icon: '/images/testng.svg',\n      },\n      {\n        name: 'Hamcrest',\n        uses: ['com.deque.html.axedevtools.selenium'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Java/hamcrest',\n        docsURL: '/devtools-html/4.0.0/en/java-test-hamcrest',\n        icon: '/images/hamcrest.jpg',\n      },\n      {\n        name: 'Selenium',\n        uses: ['com.deque.html.axedevtools.selenium'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Java/java-selenium',\n        docsURL: '/devtools-html/4.0.0/en/java-test-selenium',\n        icon: '/images/selenium.svg',\n      },\n      {\n        name: 'Playwright',\n        uses: ['com.deque.html.maven.axedevtools.playwright'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Java/playwright',\n        docsURL: '/devtools-html/4.0.0/en/java-test-playwright',\n        icon: '/images/playwright.svg',\n      },\n      {\n        name: 'TestNG',\n        uses: ['com.deque.html.axedevtools.selenium'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Java/testNG',\n        docsURL: '/devtools-html/4.0.0/en/java-overview',\n        icon: '/images/testng.svg',\n      },\n    ],\n  },\n  {\n    name: 'Python',\n    examples: [\n      {\n        name: 'Behave',\n        uses: ['axe_devtools_behave'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Python/behave',\n        docsURL: '/devtools-html/4.0.0/en/py-api-behave',\n        icon: '/images/behave.jpg',\n      },\n      {\n        name: 'PyTest',\n        uses: ['axe_devtools_selenium'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Python/pytest',\n        docsURL: '/devtools-html/4.0.0/en/py-usage-overview',\n        icon: '/images/pytest.svg',\n      },\n      {\n        name: 'Selenium',\n        uses: ['axe_devtools_selenium'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Python/python_selenium',\n        docsURL: '/devtools-html/4.0.0/en/py-api-selenium',\n        icon: '/images/selenium.svg',\n      },\n      {\n        name: 'Robot',\n        uses: ['axe_devtools_robot'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Python/robot',\n        docsURL: '/devtools-html/4.0.0/en/py-api-robot',\n        icon: '/images/robot-framework.png',\n      },\n      {\n        name: 'unittest',\n        uses: ['axe_devtools_unittest'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Python/unittest',\n        docsURL: '/devtools-html/4.0.0/en/py-api-unittest',\n        icon: '/images/python.svg',\n      },\n    ],\n  },\n  {\n    name: 'Ruby',\n    examples: [\n      {\n        name: 'Capybara with RSpec',\n        uses: ['axe-capybara'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Ruby/capybara-rspec',\n        docsURL: '/devtools-html/4.0.0/en/rb-capybara',\n        icon: '/images/capybara.png',\n      },\n      {\n        name: 'Cucumber',\n        uses: ['axe-cucumber-steps'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Ruby/selenium-cucumber',\n        docsURL: '/devtools-html/4.0.0/en/rb-cucumber',\n        icon: '/images/cucumber.svg',\n      },\n      {\n        name: 'Selenium with RSpec',\n        uses: ['axe-selenium'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Ruby/selenium-rspec',\n        docsURL: '/devtools-html/4.0.0/en/rb-selenium',\n        icon: '/images/selenium.svg',\n      },\n      {\n        name: 'Watir with RSpec',\n        uses: ['axe-watir'],\n        exampleURL:\n          'https://github.com/dequelabs/axe-devtools-html-api-examples/tree/main/Ruby/watir-rspec',\n        docsURL: '/devtools-html/4.0.0/en/rb-watir',\n        icon: '/images/watir.png',\n      },\n    ],\n  },\n]\n\nexport default data\n","import React from 'react'\nimport Header from '../components/Header'\nimport Footer from '../components/Footer'\nimport languageCategories from '../config/devtools-for-web-examples'\nimport {\n  Panel,\n  PanelContent,\n  PanelHeader,\n  Link,\n  Tab,\n  TabPanel,\n  Tabs,\n} from '@deque/cauldron-react'\nimport '@deque/cauldron-styles'\nimport './devtools-for-web-examples.scss'\nimport { Helmet } from 'react-helmet'\nimport useSiteMetadata from '../hooks/use-site-metadata'\nimport createDocumentTitle from '../lib/document-title'\nimport { navigate } from 'gatsby'\nimport { exampleClick } from '../lib/analytics'\nimport Logo from '../components/Header/Logo'\nimport SiteSearch from '../components/Search/SiteSearch'\nimport ContactUs from '../components/Header/ContactUs'\n\nexport default function () {\n  const { title: siteTitle } = useSiteMetadata()\n  const pageTitle = 'axe DevTools® for Web Examples'\n\n  const tabs: React.ReactElement[] = []\n  const tabPanels: React.ReactElement[] = []\n\n  for (const languageCategory of languageCategories) {\n    const { name: language, examples } = languageCategory\n    const tabRef: React.RefObject<HTMLDivElement> = React.useRef(null)\n    const tab = (\n      <Tab key={tabs.length} target={tabRef}>\n        {language}\n      </Tab>\n    )\n    const tabPanel = (\n      <TabPanel key={tabs.length} ref={tabRef}>\n        <div className=\"Panels\">\n          {examples.map((example, i) => (\n            <Example key={i} data={{ ...example, language }} />\n          ))}\n        </div>\n      </TabPanel>\n    )\n    tabs.push(tab)\n    tabPanels.push(tabPanel)\n  }\n\n  return (\n    <>\n      <Helmet>\n        <title>{createDocumentTitle(siteTitle, pageTitle)}</title>\n      </Helmet>\n      <div className=\"DevToolsHTMLExamples\">\n        <Header centerAlign>\n          <div className=\"cluster--left\">\n            <Logo />\n          </div>\n          <div className=\"cluster--right\">\n            <SiteSearch />\n            <ContactUs />\n          </div>\n        </Header>\n        <div className=\"Content center-align\">\n          <div>\n            <h1>{pageTitle}</h1>\n            <Tabs aria-label=\"axe DevTools® for Web examples by language\">\n              {tabs}\n            </Tabs>\n            {tabPanels}\n          </div>\n        </div>\n        <Footer centerAlign />\n      </div>\n    </>\n  )\n}\n\ninterface ExampleProps {\n  data: DevToolsHTMLExample\n}\n\nfunction Example(props: ExampleProps) {\n  const { data } = props\n  const { language, name, icon, uses, exampleURL, docsURL } = data\n\n  const handleExampleClick = async (e: React.MouseEvent) => {\n    e.preventDefault()\n    await exampleClick({ language, name, destination: 'github' })\n    navigate(exampleURL)\n  }\n\n  const handleDocsClick = async (e: React.MouseEvent) => {\n    e.preventDefault()\n    await exampleClick({ language, name, destination: 'docs' })\n    navigate(docsURL)\n  }\n\n  return (\n    <Panel>\n      <PanelHeader>\n        <h2>{name}</h2>\n      </PanelHeader>\n      <PanelContent>\n        <div className=\"Logo\">\n          <img src={icon} alt={`${name} logo`} />\n        </div>\n        <h3>Uses:</h3>\n        <ul className=\"Packages\">\n          {uses.map((name, i) => {\n            return (\n              <li key={i} className=\"Package\">\n                {name}\n              </li>\n            )\n          })}\n        </ul>\n        <div className=\"Buttons\">\n          {exampleURL && (\n            <Link\n              variant=\"button\"\n              href={exampleURL}\n              onClick={handleExampleClick}\n            >\n              <span>Code Example</span>\n              <i className=\"fas fa-external-link-alt\"></i>\n              <span className=\"Offscreen\">(links to an external site)</span>\n            </Link>\n          )}\n          {docsURL && (\n            <Link\n              className=\"Button--secondary\"\n              variant=\"button\"\n              href={docsURL}\n              onClick={handleDocsClick}\n            >\n              <span>Documentation</span>\n            </Link>\n          )}\n        </div>\n      </PanelContent>\n    </Panel>\n  )\n}\n"],"names":["SiteSearch","contentPackages","useSiteMetadata","options","filters","filter","_ref","includeInSiteSearch","map","_ref2","id","join","React","Search","modalTitle","name","examples","uses","exampleURL","docsURL","icon","title","siteTitle","pageTitle","tabs","tabPanels","languageCategory","languageCategories","language","tabRef","tab","Tab","key","length","target","tabPanel","TabPanel","ref","className","example","i","Example","data","push","Helmet","createDocumentTitle","Header","centerAlign","Logo","ContactUs","Tabs","Footer","props","Panel","PanelHeader","PanelContent","src","alt","Link","variant","href","onClick","async","e","preventDefault","exampleClick","destination","navigate"],"sourceRoot":""}