Extract form values through the DOM.

Usage no npm install needed!

<script type="module">
  import theoryofnekomataFormxtr from 'https://cdn.skypack.dev/@theoryofnekomata/formxtr';



Extract form values through the DOM.


The package can be found on:


For an example form:

<!-- ...  -->

<form id="form">
    <input type="text" name="username" />
    <input type="password" name="password" />
    <button type="submit" name="type" value="client">Log In As Client</button>
    <button type="submit" name="type" value="admin">Log In As Admin</button>

<!-- ... --->

Use the library as follows (code is in TypeScript, but can work with JavaScript as well):

import getFormValues from '@theoryofnekomata/formxtr';

const form: HTMLFormElement = document.getElementById('form');

// optional, but just in case there are multiple submit buttons in the form,
// individual submitters can be considered
const submitter = form.querySelector('[type="submit"][name="type"][value="client"]');

const values = getFormValues(form, submitter);

const processResult = (result: Record<string, unknown>) => {
  throw new Error('Not yet implemented.');

// Best use case is with event handlers
form.addEventListener('submit', async e => {
    const { target: form, submitter } = e;

    const values = getFormValues(form, submitter);

    // Get the form values and send as request to some API
    const response = await fetch(
            method: 'POST',
            body: JSON.stringify(values),
            headers: {
                'Content-Type': 'application/json',

    if (response.ok) {
        const result = await response.json();



The library has been tested on JSDOM through Jest, and the real DOM using Cypress.