Update og:image tag to use fully-qualified URL (#1177)

* Update og:image tag to use fully-qualified URL

* Allow RESOURCE_BASE_URL to be an empty string

* Adding comment about .env validation change

base-theme/layouts/partials/extra_metadata.html

@@ -1,5 +1,6 @@
 {{ $context := .context }}
 {{ $imageData := partial "course-image-url.html" $context }}
-{{ $courseImageUrl := index $imageData 0 }}
-
-<meta property="og:image" content="{{- $courseImageUrl -}}" />
+{{ $courseImageMetadata := index $imageData 1 }}
+{{- $sitemapDomain := partial "sitemap_domain.html" -}}
+{{- $absCourseImage := printf "https://%s%s" $sitemapDomain $courseImageMetadata.Params.file -}}
+<meta property="og:image" content="{{- $absCourseImage -}}" />

env.ts

@@ -54,8 +54,9 @@ const envSchema = {
   OCW_TEST_COURSE: envalid.str({
     devDefault: "9.40-spring-2018"
   }),
-  RESOURCE_BASE_URL: envalid.url({
-    desc:       "Base URL with which to prefix resource paths in hugo's output.",
+  RESOURCE_BASE_URL: envalid.str({
+    // str, not url, to allow for ""
+    desc:       "Base URL with which to prefix resource paths in Hugo's output.",
     devDefault: "https://live-qa.ocw.mit.edu/"
   }),
   SEARCH_API_URL: envalid.url({

tests-e2e/ocw-ci-test-course/homepage.spec.ts

@@ -62,3 +62,13 @@ test.describe("Course info", () => {
     })
   })
 })
+
+test("og:image tag has fully-qualified URL", async ({ page }) => {
+  const course = new CoursePage(page, "course")
+  await course.goto()
+  const metaShareImage = page.locator('meta[property="og:image"]')
+  await expect(metaShareImage).toHaveAttribute(
+    "content",
+    "https://live-qa.ocw.mit.edu/courses/123-ocw-ci-test-course-fall-2022/example_jpg.jpg"
+  )
+})