Typeform Helpers

typeform-helpers.js

// background
function timer(ms) { return new Promise(res => setTimeout(res, ms)); }
async function keepGoing(direction, i) {
    await timer(500);
    const directions = {"up": "previous", "down": "next"};
    document.querySelectorAll(`[data-qa="fixed-footer-navigation-${directions[direction]}"]`)[0].click()
    
    await timer(500);
    let focusQ = document.querySelectorAll('[data-qa-focused="true"]')[0]
    let qId = focusQ.getAttribute('data-qa-blockref');
    let qStart = focusQ.querySelector('[data-qa="question-header"]').outerText.substring(0, 64);
    console.log(`${i + 1}: ${direction} to ${qId}: ${qStart}`);
}
async function moveTo(qId, direction) {
    for (let i = 0; i < 500; i++) {
        if (!document.querySelector(`#block-${qId}`)) {
            await keepGoing(direction, i);
            continue;
        }
        if (document.querySelector(`#block-${qId}`).getAttribute('data-qa-focused') == 'false') {
            await keepGoing(direction, i);
            continue;
        }
        console.log(`${i + 1}: found ${qId}!`)
        break;
    }
}

// helper functions
function getId() {
    return document.querySelectorAll('[data-qa-focused="true"]')[0].getAttribute('data-qa-blockref');
}
async function rewindTo(qId) { moveTo(qId, 'up'); }
async function skipTo(qId) { moveTo(qId, 'down'); }
async function getData() {
    const fileHandle = await window.showSaveFilePicker();
    const fileStream = await fileHandle.createWritable();
    await fileStream.write(new Blob([localStorage.getItem('tf_')], {type: 'text/plain'}));
    await fileStream.close();
}
function restoreData(data) { localStorage.setItem('tf_', JSON.stringify(data)); }

1. Start the Typeform survey (you have to at least click Start for this code to work)
2. Then open your browser's developer console; see instructions here: https://balsamiq.com/support/faqs/browserconsole/
3. Then paste this code into the console and hit Enter.
4. Then you have some options!
   1. To get the ID of the question you're on, type getId() (just like that) and hit Enter.
   2. To rewind to an earlier question, type rewindTo('paste the ID of the question') and hit Enter (pasting in the ID of the question of course).
   3. To skip ahead to a question (say, after you went back, to return to where you were), type skipTo('paste the ID of the question') and hit Enter.
   4. To get your Typeform data as a file, type getData() and hit Enter.
   5. To restore data you saved earlier without having to enter it all manually, type restoreData(), paste the data between the parentheses, and hit Enter.

The Typeform we found this helpful on was our Finsure Policy Software Feature Assessment: https://bit.ly/psfa-v1-2.

And here's a series of videos walking through those steps visually!

• Setup and the dev console: https://www.loom.com/share/63435d493d09432cbe2402493570bd78
• Rewinding and skipping questions: https://www.loom.com/share/288c82383acc4fb9b169f10c8d5e6cad
• Getting your data out of Typeform: https://www.loom.com/share/10ce45eae58f4916b754d6196ce6d83a
• Restoring saved data w/o having to re-enter it: https://www.loom.com/share/c4b942255ec14a7e8d5e23b05005833c