refactor: several changes

- Move getConfig out of popups
- Change some default settings
- Format OpenAI response as list
- Improve image sizing
- Run formatter on contents file
- Remove extra logging from background
- Add actual error handling in background

src/background/index.chrome.ts

@@ -3,17 +3,25 @@ import { installedHandler } from './background';
 import { parseAndReply } from './parsing';
 
 const scrapeHandler = async ({ url }, res: (response?: any) => void) => {
-  const resp = await fetch(url)
-  const html = await resp.text();
-  const doc = new DOMParser().parseFromString(html, 'text/html');
-  // @ts-expect-error - linkedom's document is FAKE and missing lots of properties, but we don't care because we don't use them :)
-  await parseAndReply(doc, url, res)
+  try {
+    const resp = await fetch(url)
+    const html = await resp.text();
+    const doc = new DOMParser().parseFromString(html, 'text/html');
+    // @ts-expect-error - linkedom's document is FAKE and missing lots of properties, but we don't care because we don't use them :)
+    await parseAndReply(doc, url, res)
+  } catch (err) {
+    res({ error: err.message })
+  }
 }
 
 const parseHTMLHandler = async ({ html, url }, res: (response?: any) => void) => {
-  const doc = new DOMParser().parseFromString(html, 'text/html');
-  // @ts-expect-error - see above
-  await parseAndReply(doc, url, res)
+  try {
+    const doc = new DOMParser().parseFromString(html, 'text/html');
+    // @ts-expect-error - see above
+    await parseAndReply(doc, url, res)
+  } catch (err) {
+    res({ error: err.message })
+  }
 }
 
 const messageHandler = (req: any, sender, res: (response?: any) => void) => {

src/background/index.firefox.ts

@@ -2,15 +2,23 @@ import { installedHandler } from "./background";
 import { parseAndReply } from "./parsing";
 
 const scrapeHandler = async ({ url }, res: (response?: any) => void) => {
-  const resp = await fetch(url)
-  const html = await resp.text();
-  const doc = new DOMParser().parseFromString(html, "text/html")
-  await parseAndReply(doc, url, res)
+  try {
+    const resp = await fetch(url)
+    const html = await resp.text();
+    const doc = new DOMParser().parseFromString(html, "text/html")
+    await parseAndReply(doc, url, res)
+  } catch (err) {
+    res({ error: err.message })
+  }
 }
 
 const parseHTMLHandler = async ({ html, url }, res: (response?: any) => void) => {
-  const doc = new DOMParser().parseFromString(html, "text/html")
-  await parseAndReply(doc, url, res)
+  try {
+    const doc = new DOMParser().parseFromString(html, "text/html")
+    await parseAndReply(doc, url, res)
+  } catch (err) {
+    res({ error: err.message })
+  }
 }
 
 const messageHandler = (req: any, sender, res: (response?: any) => void) => {

src/background/parsing.ts

@@ -13,9 +13,12 @@ const parseHTMLMeta = (doc: Document, url: string) => {
     doc.querySelector('title')?.textContent;
   const description = (doc.querySelector('meta[property="og:description"]') as HTMLMetaElement)?.content ||
     (doc.querySelector('meta[name="description"]') as HTMLMetaElement)?.content;
-  const imageUrl = (doc.querySelector('meta[property="og:image"]') as HTMLMetaElement)?.content ||
+  let imageUrl = (doc.querySelector('meta[property="og:image"]') as HTMLMetaElement)?.content ||
       (doc.querySelector('meta[property="og:image:url"]') as HTMLMetaElement)?.content ||
-      getFirstImage(doc, url);
+      (doc.querySelector('img') as HTMLImageElement)?.src;
+  if (!imageUrl.startsWith("http")) {
+    imageUrl = new URL(imageUrl, url).href;
+  }
   return {
     title,
     description,
@@ -29,23 +32,6 @@ const addBaseElement = (doc: Document, url: string) => {
   doc.head.append(baseEl);
 }
 
-const getFirstImage = (doc: Document, url: string) => {
-  // If we don't have an image handed to us, take the first image in the body of the page
-  const img = doc.querySelector('img');
-
-  if (img) {
-    var imgObj: { url: string, width?: string, height?: string } = { url: '' };
-
-    const src = (img as HTMLImageElement).src;
-    // The src might be relative, so we need to convert it to an absolute URL
-    if (src && src.startsWith('http')) {
-      return src;
-    } else {
-      return new URL(src, url).href;
-    }
-  }
-}
-
 const parseReadability = async (doc: Document) => {
   const documentClone = doc.cloneNode(true);
   // @ts-ignore - Readability wants a document and we're giving it a node, but it doesn't actually matter

src/background/services/github.ts

@@ -8,12 +8,9 @@ const GithubParser: Parser = {
     return path.length >= 3
   },
   parse: async (node: Node, url: string) => {
-    console.log("Parsing Github")
     const path = new URL(url).pathname.split("/") // ["", "user", "repo", ...]
     const data = await fetch(`https://api.github.com/repos/${path[1]}/${path[2]}/readme`).then(res => res.json())
-    console.log(data)
     const decoded = atob(data.content)
-    console.log(decoded)
     return {
       body: `URL: ${url}\nREADME: ${decoded}`,
       siteName: "Github",