Add Chase Offers

add-chase-offers.user.js

// ==UserScript==
// @name         Add Chase offers
// @namespace    http://tampermonkey.net/
// @version      2024-10-20
// @description  - _-
// @author       Art Chen
// @match        https://secure.chase.com/web/auth/dashboard
// @icon         https://www.google.com/s2/favicons?sz=64&domain=chase.com
// @grant        none
// ==/UserScript==

const selectors = {
    addOfferButton: 'mds-icon[type="ico_add_circle"]',
    backShadowRoot: 'mds-navigation-bar[experience-name="About this deal"]',
    offerBackButton: '#back-button'
};

function waitForReady() {
    return new Promise((resolve) => {
        const sampleButton = document.querySelector(selectors.addOfferButton);

        if (sampleButton) {
            resolve();
            return;
        }

        setTimeout(() => {
            waitForReady().then((btn) => resolve(btn));
        }, 1000);
    });
}

function makeButton() {
    const button = document.createElement('button');
    button.id = "add-all-offers-button";
    button.textContent = 'Add all offers';

    const findOffers = () => {
        const allOffers = document.querySelectorAll(selectors.addOfferButton);
        button.textContent = `Remaining Offers: ${allOffers.length}. Please wait...`;
        return allOffers;
    };

    button.addEventListener('click', async () => {
        while (true) {
            const nextOffer = findOffers()[0];
            if (!nextOffer) {
                break;
            }

            nextOffer.click();
            await new Promise(r => setTimeout(r, 500));

            const backNavSR = document.querySelector(selectors.backShadowRoot).shadowRoot;
            backNavSR.querySelector(selectors.offerBackButton).click();

            await new Promise(r => setTimeout(r, 1000));
        }

        button.textContent = `All offers added. Click to restart.`;

        window.scrollTo({
            top: 0,
            left: 0,
            behavior: "smooth",
        });
    });

    return button;
}

function makeStyle() {
    const styleEl = document.createElement('style');
    const css = `
#add-all-offers-button {
  position: fixed;
  z-index: 10001;
  left: 50%;
  transform: translate3d(-50%, 0, 0);
  transition: background 0.24s;
  background: #ffffff;
  border: 0;
  border-radius: 5px;
  padding: 0 15px;
  height: 36px;
  top: 10px;

    align-items: center;
    appearance: none;
    background-color: #FCFCFD;
    box-shadow: rgba(45, 35, 66, 0.4) 0 2px 4px, rgba(45, 35, 66, 0.3) 0 7px 13px -3px, #D6D6E7 0 -3px 0 inset;
    box-sizing: border-box;
    color: #36395A;
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    line-height: 1;
    list-style: none;
    overflow: hidden;
    text-decoration: none;
    transition: box-shadow .15s, background .15s, transform .15s;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
    white-space: nowrap;
    will-change: box-shadow, transform;
    font-size: 14px;
}
#add-all-offers-button:hover {
    box-shadow: rgba(45, 35, 66, 0.4) 0 4px 8px, rgba(45, 35, 66, 0.3) 0 7px 13px -3px, #D6D6E7 0 -3px 0 inset;
    transform: translate3d(-50%, -2px, 0);
}
#add-all-offers-button:active {
    box-shadow: #D6D6E7 0 3px 7px inset;
    transform: translate3d(-50%, 2px, 0);
}
   `;
    styleEl.type = 'text/css';
    styleEl.appendChild(document.createTextNode(css));
    return styleEl;
}

(async function() {
    'use strict';

    await waitForReady();
    const addAllOfferButton = makeButton();
    document.body.prepend(addAllOfferButton);

    const styleEl = makeStyle();
    document.head.appendChild(styleEl);
})();