basic SEO element check

seo-check-bookmarklet.js

// bookmarklettalize with e.g. https://chimurai.github.io/bookmarklet/
/* global document */
/* eslint-disable no-console, unicorn/prevent-abbreviations, security/detect-object-injection */
function htmlCollectionToArray(pElementArray) {
  let lReturnValue = [];
 
  for (let lElement of pElementArray) lReturnValue.push(lElement);
 
  return lReturnValue;
}
 
function matchesTagCriteria(pElement, pAttribute, pValue) {
  return pElement?.attributes?.[pAttribute]?.value === pValue;
}
 
function getContent(pElement, pType) {
  if (pType === "meta") return pElement?.attributes?.content?.value;
  if (pType === "link") return pElement?.attributes?.href?.value;
  return "(unknown tag type - couldn't retrieve contents)";
}
 
function getTagCheckRecordForTitle() {
  const lTitle = document.title;
 
  return {
    isFound: Boolean(lTitle),
    name: "title",
    content: lTitle,
  };
}
 
function getTagCheckRecordForElement({ type, attributeName, value }) {
  const lElements = document.querySelectorAll(type);
  const lElement = htmlCollectionToArray(lElements).find((pElement) =>
    matchesTagCriteria(pElement, attributeName, value)
  );
  return {
    isFound: Boolean(lElement),
    name: `${attributeName}=${value}`,
    content: Boolean(lElement) && getContent(lElement, type),
  };
}
 
function reportTagCheck({ isFound, name, content }) {
  if (isFound) {
    console.groupCollapsed(
      `%cThe page has a %c${name}%c tag`,
      "color:darkgreen",
      "color:gray",
      "color:darkgreen"
    );
    console.log(`%c${content}`, "font-family:sans-serif");
    console.groupEnd();
  } else {
    console.log(
      `%cNo %c${name}%c exists in the page`,
      "color:red",
      "color:gray",
      "color:red"
    );
  }
}
 
(function report() {
  const SEO_ELEMENTS = [
    { type: "meta", attributeName: "name", value: "description" },
    { type: "meta", attributeName: "name", value: "keywords" },
    { type: "link", attributeName: "rel", value: "canonical" },
    { type: "meta", attributeName: "property", value: "og:title" },
    { type: "meta", attributeName: "property", value: "og:description" },
    { type: "meta", attributeName: "property", value: "og:site_name" },
    { type: "meta", attributeName: "property", value: "og:url" },
    { type: "meta", attributeName: "property", value: "og:image" },
    // { type: "meta", attributeName: "property", value: "og:image:type" },
    { type: "meta", attributeName: "property", value: "robots" },
  ];
  console.group("%cmeta tag check", "background-color:white;color:blue");
  reportTagCheck(getTagCheckRecordForTitle());
  SEO_ELEMENTS.map(getTagCheckRecordForElement).forEach(reportTagCheck);
  console.groupEnd();
})();