npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

wdb

v0.0.1

Published

simple light weight interface for selenium webdriver (node js)

Downloads

16

Readme

UI automated testing framework powered by Node.js. Uses the Selenium WebDriver API. Uses the ChromeDriver API

Base: lazy elements, chrome driver dirrect connection, own standalone server and chrome driver installer

Install Node.js and install framework

Improvement plan

  • [x] Run selenium server from a client instance method
  • [x] Add possibility find element by xpath (done)
  • [ ] Develop error handler system
  • [x] Develop and improve enviroment installer for every OS
$ npm i --SD wd-interface

Drivers installation

$ wd-interface standalone chrome gecko

Run driver selenium-standalone-server or chrome driver

$ wd-interface start standalone  #for standalone
$ wd-interface start chrome  #for chromedriver 
$ wd-interface start gecko  #for geckdriver

Simple as a library

Use with mocha or other test runner

Base example Api

const { expect } = require('chai')

const { client, element } = require('wd-interface')

describe('Google base example', () => {
  let browser = null
  const baseURL = 'https://www.google.com.ua/'

  //selectors
  const submitsearch = '[name="btnK"]'
  const inputsearch = '#lst-ib'
  const resultsearch = '#ires .g'
  //elements
  const submitSearch = element(submitsearch)
  const inputSearch = element(inputsearch)
  const resultSearch = element(resultsearch)

  before(async () => {
    browser = client().chrome() // for dirrect connection to chromedriver client().chrome(true)
    await browser.startSelenium()
    await browser.goTo(baseURL)
  })

  after(async () => {
    await browser.closeBrowser()
    await browser.stopSelenium()
  })

  it('search git hub potapovDim', async () => {
    await inputSearch.sendKeys('git hub potapovDim')
    await submitSearch.click()
    await browser.sleep(1000)
    await resultSearch.waitForElement(1000)
    const allTextInSelector = await resultSearch.getText()
    expect(allTextInSelector).to.includes('potapovDim')
  })
})

Api

Browser

  const {client} = require('wd-interface')
  const browserChrome = client().chrome() // for chrome browser
  const browserFirefox = client().firefox() //for firefox browser
  /* return browser api instance
   * args directConnect bool true to chrome or gecko driver , false for connect to standalone server
   * timeouts = {
   *   'script': 5000,    // Sets the amount of time to wait for an asynchronous script to finish execution before throwing an error.
   *   'implicit': 5000,  // Specifies the amount of time the driver should wait when searching for an element if it is not immediately present.
   *   'page load': 5000, // Sets the amount of time to wait for a page load to complete before throwing an error.
   *   'request': 1000    // Sets the amount of time to wait for a response from driver.
   * }
   * 
   * any, false , undefined - conncect to standalone server port 4444
   * 
   */

chrome

   const chromeWithDirrectConnectToChromeDriverAndScriptWaitTenSeconds = client().chrome(true, { 'script': 10000 })
   const defaultChrome = client().chrome()

firefox

const fireFoxWithPageLoadNineSecondsAndConnectToStandalone = client().firefox(false, { 'page load': 9000 })
const defaultFireFox = client().firefox()

goTo

  const browser = client.chrome() 
  await browser.goTo('https://google.com')
  /* args url
   * type string
   * /

Keys

  const browser = client.chrome() 
  const el = element('.test.class')
  await el.sendKeys('test name', browser.Keys.ENTER) // for submit

startSelenium

  const browser = client.chrome() 
  await browser.startSelenium()
  /* 
   * it will start selenium process 
   * if selenium standalone chromedriver geckdriver was install 
   * /

stopSelenium

  const browser = client.chrome() 
  await browser.stopSelenium()
  /* 
   * it will stop selenium process 
   * if it was runned by previous command
   * /

closeCurrentTab

  const browser = client.chrome() 
  await browser.closeCurrentTab()
  /* 
   * will close current tab 
   * if opened tabs length more than 1
   * /

waitForUrlIncludes

  const browser = client.chrome() 
  await browser.waitForUrlIncludes('test', 1000)
  /* 
   * will wait 1000ms for url includes test 
   * /

switchToFrame

  const browser = client.chrome() 
  await browser.switchToFrame('#myFrame')
  /* 
   * arg css selector (id , class or some atribute)
   * / 

refresh

  const browser = client.chrome() 
  await browser.refresh()
  /* 
   * refresh browser current page
   * / 

back

  const browser = client.chrome() 
  await browser.back()
  /* 
   * browser histor go back 
   * / 

forward

  const browser = client.chrome() 
  await browser.forward()
  /* 
   * browser histor go forward 
   * / 

getTitle

  const browser = client.chrome() 
  const currentTitle = await browser.getTitle()
  /* 
   * will return tab title
   * /

executeScript

  const browser = client.chrome() 
  const currentTitle = await browser.executeScript(function () {
    const [cssSelector] = arguments
    return document.querySelector(cssSelector).innerHTML
  }, 'body')
  /* first arg is function or string function ,for example 'return arguments[0]'
   * if function return value it will be returned
   * /

executeScriptAsync

  const browser = client.chrome() 
  const currentTitle = await browser.executeScriptAsync(function () {
    const [callback] = arguments
      fetch('http://localhost:8085/bar', {
        node: 'no-cors'
      }).then(resp => resp.json()).then(callback)
  })
  /* first arg is function or string function ,for example 'return arguments[0]'
   * if function return value it will be returned
   * /

switchToTab

  const browser = client.chrome() 
  await browser.switchToTab(1)
  /* for example if was opened link with _blank
   * will switch to opened tab
   * /

closeBrowser

  const browser = client.chrome() 
  await browser.closeBrowser()
  /* for example if was focused tab from switchToTab example
   * this will close current tab and focus you to previous
   * /

getCurrentBrowserTab

  const browser = client.chrome() 
  const tabId = await browser.getCurrentBrowserTab()
  /* return selenium tab id * /

getBrowserTabs

  const browser = client.chrome() 
  const tabIdS = await browser.getBrowserTabs()
  /*
  * return array with selenium tab ids
  */

sleep

  const browser = client.chrome() 
  await browser.sleep(1000)
  /* args number timeout 
  * will wait until timeout end
  */

getUrl

  const browser = client.chrome() 
  const currentUrl = await browser.getUrl()
  /* return current tab url*/

Element

ConstructorElement

  const elementDiv = element('div')
  /* 
  * args css selector for example '#id', '[name="name"]', '.class'
  */

sendKeys

  const elementInput = element('input')
  await elementInput.sendKeys('test value')
  /* 
  * args string or array string
  */

clear

  const elementInput = element('input')
  await elementInput.clear()
  /* 
  * clear value inside input
  */

getElementHTML

  const elementInput = element('input')
  const inputHTML = await elementInput.getElementHTML()
  /* 
  * return outerHTML of current element , return string
  * <input value="a"/> for example
  */

getText

  const elementDiv = element('div')
  const divText = await elementDiv.getText()
  /* 
  * return all text inside element , return string
  */

waitForElement

  const elementDiv = element('div')
  await elementDiv.waitForElement(1000)
  /* 
  * will wait for element mount to DOM node
  */

waitForElementPresent

  const elementDiv = element('div')
  await elementDiv.waitForElementPresent(1000)
  /* 
  * will wait for element mount to DOM node
  */

waitForElementVisible

  const elementDiv = element('div')
  await elementDiv.waitForElementVisible(1000)
  /* 
  * will wait for element visible in DOM node
  */

getElement

  const elementSpan = element('div').getElement('span').getElement('a')
  /* 
  *  return element instanse
  */

getElements

  const elementsSpan = element('div').getElements('span')
  /* 
  *  return Elements instance
  */

getAttribute

  const elementSpan = element('div').getElement('span')
  const style = await elementSpan.getAttribute('style')
  /*
  * args strin , value name , for example 'value', 'href', 'style' etc 
  *  return string of attribute value
  */

click

  const elementSpan = element('div').getElement('span')
  await elementSpan.click()
  /*
  * triger click 
  */

isPresent

  const elementSpan = element('div').getElement('span')
  const present = await elementSpan.isPresent()
  /*
  * return true if element mounted to DOM
  * return false if element didn`t mount to DOM
  */

isDisplayed

  const elementSpan = element('div').getElement('span')
  const display = await elementSpan.isDisplayed()
  /*
  * return true if visible and in view port
  * return false if doesn`t visible, for example display: none
  */

toElement

  const elementSpan = element('div').getElement('span')
  await elementSpan.toElement()
  /*
  * will scroll view port to element 
  */

mouseDownAndMove

  const elementSpan = element('div').getElement('span')
  await elementSpan.mouseDownAndMove({x: 100, y: 0})
  /*
  * args object with x and y 
  * will mouse down mouse move from x and y from arg
  */

Elements

Constructor elements

  const elementDiv = elements('div')
  const {elements} = require('wd-interface')
  // by css selector
  const elementsSpan = elements('span')
  // by xpath 
  const elementsDiv = elements('xpath: /html/body/div[1]/div/div/div/div[1]/div[2]/div[2]/div/div')
 /* 
  *  args css selector for example '#id', '[name="name"]', '.class' or xpath format xpath: /html/body/div (for example)
  *  return array Element instaces
  */

waitForElement

  const elementDiv = elements('div')
  await elementDiv.waitForElements(1000)
  /* 
  * will wait for first element with selector mount to DOM node
  */

map

  // by css selector
  const elementsSpan = elements('span')
  const textArr = await elementsSpan.map(async (element) => {
        return await element.getText()
      })
  /* 
  *  args async call back 
  *  return array  
  */

forEach

  //by css selector
  const elementsSpan = elements('span')

  const textArr = await elementsSpan.forEach(async (element) => {
        const html = await element.getElementHTML()
        expect(html).to.includes('dropitem')
        expect(html).to.includes('draggable="true"')
      })
  /* 
  * args async call back 
  * call async funcs with await 
  * does not return 
  * /

filter

 const elementsSpan = elements('span')
 const textArr = await elementsSpan.filter(async (element) => {
        const html = await element.getElementHTML()
        return html.includes('class="test"')
      })
  /* 
  * args async call back 
  * call async funcs with await
  * return new elements array  
  * /

get

 const elementsSpan = elements('span')
 const textArr = await elementsSpan.get(0)
  /* 
  * args index number
  * return Element instance 
  * /