Search code examples
javascriptcheckboxgreasemonkeysteamtampermonkey

Automatically check a checkbox with a userscript?


Some sites (namely Steam Community Market) require the user to manually check a specific checkbox for repetitive actions like buying items.

I'd like to have that checkbox always checked.

  • URL:
    http://steamcommunity.com/market/listings/730/USP-S%20%7C%20Torque%20(Field-Tested)
  • element:
    <input id="market_buynow_dialog_accept_ssa" type="checkbox" value="0" name="accept_ssa">

Can that be done with Tampermonkey?

I found document.getElementById("checkbox").checked = true; which seems logical to me. I put it in a new Tampermonkey script and added steam market to the list of websites the script activates on but it didn't work.


Solution

    1. Find a pattern in the urls where the userscript should be executed, for example if it's http://steamcommunity.com/market/listings/730/USP-S%20%7C%20Torque%20(Field-Tested) then we can assume the part starting with 730 is volatile so we'll replace it with * in @include key.
    2. We should wait for the checkbox element to be added on the page, there are two methods: MutationObserver-based (I'll use setMutationHandler wrapper) and setInterval-based (best known wrapper is waitForKeyElements). Both are plugged in via @require key.

    // ==UserScript==
    // @name        Steam - accept the agreement
    // @include     http://steamcommunity.com/market/listings/*
    // @require     https://greasyfork.org/scripts/12228/code/setMutationHandler.js
    // ==/UserScript==
    
    
    // maybe the elements are already on the page
    checkThem([].slice.call(document.querySelectorAll('input[type="checkbox"]')));
    
    // but anyway set a MutationObserver handler for them
    setMutationHandler(document, 'input[type="checkbox"]', checkThem);
    
    function checkThem(nodes) {
        nodes.forEach(function(n) { n.checked = true });
    }
    

    More info: Greasespot wiki.