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

hmpo-journey-tester

v4.2.0

Published

Form Journey tester with Axe support

Downloads

7

Readme

passports-grey-box-tester

An ultra lightweight smoke tester for GDS based forms

This is an ultra lightweight smoke tester allowing you to run through multiple parts of your journey and validate that the end point was reached.

It assumes a number of defaults but can be overridden as required on a page/step basis.

It is explicitly intended to be flexible - the same configuration should be run against multiple stages of deployment, e.g integration, staging and production without requiring any changes. This enables you to ensure that even with many microservices involved, that your key journey is still functional. Consider this your 100 000 feet view - anything more complicated than successfully reaching the end path should be considered for a more low level test.

It is designed to target passports-form-wizard forms, but can be applied to similar GDS style pages.

Technology

  • Google Puppeteer
  • Selenium Webdriver
  • Axe

Config

A journey is a JSON file containing the following sections:

  • pages
    • this is a keyed object with the key representing the path of a page
      • fields - this is a keyed object with selectors and values for those fields
        • radiobuttons & checkboxes ignore the value
        • file inputs use the value as a filename to upload, this is relative to the journey JSON file.
      • navigate
        • submit button or continuation link selector. If this is false the journey will wait to automatically navigate to the next page. This can also be an array of selectors to try in sequence until one is found.
      • maxRetries
        • The maximum number of times this path can be visited.
      • waitFor
        • specify how to wait for page navigation. Can be set to wait for a page load, to wait for network idle, or a delay in milliseconds. Defaults load.
      • collect
        • a keyed object mapping identifiers in the page to property values to be stored.
      • navigationTimeout
        • the maximum time in milliseconds to wait to progress to the next page. Defaults to 30 seconds.
      • axe - Axe configuration object axe: { run - Run axe against this page (default: true) options - Axe run options stopOnFail - Stop journey if there are any axe errors (default: true) simple - Simplify axe output (default: true) ignore - Object of ids to ignore, with optional matching paterns path - Pattern to match offending url path html - Pattern to match offending html opening tag summary - Pattern to match description of error target - Pattern to match reported target element
  • staticPages
    • array of static page paths to build a pages object
  • url
    • a default hostname for the start and final paths. Defaults to http://localhost. Can be overridden with the --url command line option.
  • start
    • the start path. Defaults to '/'
  • final
    • the successful final path. Defaults to '/'
  • exitPaths
    • if you have pages that are considered an error state, but are still on your site, define them here.
  • allowedHosts
    • if you have any other hosts that are accessed as part of your journey (e.g. payment gateways)
  • defaults
    • Any options you define here will apply to all pages unless overridden per page.
  • browser - an object of puppeteer browser options.
    • pupeteer - set to true to use Puppeteer
    • selenium - set to true to use Selenium
    • headless - run Puppeteer in headless mode. Can be overridden with --headless and --no-headless
    • slowMo - run in slow mode. Can be overridden --slomo 500
    • capabilities - set object of Selenium capabilities
  • lastPagePause
    • length of time in milliseconds to pause on the last page in non-headless mode
  • disableImages
    • don't download images
  • disableCSS
    • don't download css
  • disableAnalytics
    • don't talk to google analytics collect endpoint
  • disableJavascript
    • disable Javascript in the browser
  • axe
    • Run Axe tests on journey - can be set with the --axe cli flag

#Example Config

{
    "url": "http://www.myhost.com",
    "start": "/first-service/start",
    "final":"/end-service/confirmation"
    "pages": {
        "/start-service/page3": {
            "fields": {
                "#is-uk-application-false": "selected",
                "#country-of-application": "SY"
            }
        },
        "/middle-service/upload": {
            "fields": {
                "#filename":
                    "file://image.jpg"
            },
            "navigate": false
        },
        "/middle-service/lots-of-buttons": {
            "navigate": [
                "a.button-1",
                "input[type='submit']",
                false
            ]
        },
    },
    "allowedHosts": [
        "payment.int.example.org",
        "payment.staging.example.org",
        "offical-payment-provider.example.net"
    ],
    "defaults": {
        "maxRetries": 3
    },
    "browser": {
        "puppeteer: true,
        "slowMo": 500
    }
}

Usage example

./cli.js --headless --slowmo 500 --url https://www.example.com base.json journey.json --axe