msn-show-source

Add the source article to MSN News
Wrap lines
// ==UserScript==
// @name        msn-show-source
// @version     1.0.2
// @author      Elanora Manson
// @description Add the source article to MSN News
// @license     ISC
// @namespace   Violentmonkey Scripts
// @match       *://*.msn.com/*/news/*
// @match       *://msn.com/*/news/*
// @grant       none
// @homepageURL https://github.com/elanora96/msn-show-source
// ==/UserScript==

"use strict";
function getCanonicalLink() {
  const canonicalLinkEl = document.head.querySelector('link[rel="canonical"]');
  if (!canonicalLinkEl) return null;
  const canonicalLinkObj = {
    href: canonicalLinkEl.href,
    domainNameArr: /^(?:https?:\/\/)?(?:www\.)?([^/]+)/i.exec(
      canonicalLinkEl.href,
    ),
  };
  return canonicalLinkObj;
}
function makeBanner(link) {
  const bannerHeight = "1.5rem";
  const root = document.body.querySelector("#root");
  if (root) root.style.marginTop = `calc(${bannerHeight} + 1rem)`;
  const banner = document.createElement("div");
  Object.assign(banner.style, {
    position: "fixed",
    top: "0",
    width: "100%",
    height: bannerHeight,
    backgroundColor: "var(--fill-color)",
    color: "var(--neutral-foreground-rest)",
    borderBottom: ".1rem solid var(--neutral-foreground-hint)",
    zIndex: "998",
    padding: ".5rem",
    textAlign: "center",
  });
  banner.innerText = "Source article: ";
  const anchor = document.createElement("a");
  anchor.href = link.href;
  anchor.style.color = "var(--accent-foreground-rest)";
  anchor.innerText = link.domainNameArr[1];
  banner.appendChild(anchor);
  document.body.appendChild(banner);
}
(function () {
  const observer = new MutationObserver(() => {
    const canonicalLink = getCanonicalLink();
    if (canonicalLink) {
      observer.disconnect();
      makeBanner(canonicalLink);
    }
  });
  observer.observe(document.head, { childList: true, subtree: true });
})();