FIX: Treat contact_url setting as a domain by default (#30225)

This commit makes the `contact_url` in the /about page behave as an absolute URL instead of a relative one if it doesn't explicitly start with a slash or a protocol. This prevents situation where, e.g., `www.example.com` is specified in the setting and the contact URL anchor tag ends up with a `href` that navigates to `<site address>/www.example.com` instead of just `www.example.com`. We prevent this by adding 2 leading slashes `//` to `contact_url` which makes the `href` resolves to the specified `contact_url` using the same protocol as the current site's.

Internal topic: t/143907.

app/assets/javascripts/discourse/app/components/about-page.gjs

@@ -149,8 +149,9 @@ export default class AboutPage extends Component {
     const email = escape(this.args.model.contact_email || "");
 
     if (url) {
+      const href = this.contactURLHref;
       return i18n("about.contact_info", {
-        contact_info: `<a href='${url}' target='_blank'>${url}</a>`,
+        contact_info: `<a href='${href}' target='_blank'>${url}</a>`,
       });
     } else if (email) {
       return i18n("about.contact_info", {
@@ -161,6 +162,20 @@ export default class AboutPage extends Component {
     }
   }
 
+  get contactURLHref() {
+    const url = escape(this.args.model.contact_url || "");
+
+    if (!url) {
+      return;
+    }
+
+    if (url.startsWith("/") || url.match(/^\w+:/)) {
+      return url;
+    }
+
+    return `//${url}`;
+  }
+
   get siteAgeString() {
     const creationDate = new Date(this.args.model.site_creation_date);
 
@@ -278,7 +293,7 @@ export default class AboutPage extends Component {
       <div class="about__right-side">
         <h3>{{i18n "about.contact"}}</h3>
         {{#if this.contactInfo}}
-          <p>{{htmlSafe this.contactInfo}}</p>
+          <p class="about__contact-info">{{htmlSafe this.contactInfo}}</p>
         {{/if}}
         <p>{{i18n "about.report_inappropriate_content"}}</p>
         <h3>{{i18n "about.site_activity"}}</h3>

app/assets/javascripts/discourse/tests/integration/components/about-page-test.gjs

@@ -11,12 +11,16 @@ function createModelObject({
   moderators = [],
   stats = {},
 }) {
-  return {
-    title,
-    admins,
-    moderators,
-    stats,
-  };
+  const model = arguments[0] || {};
+  return Object.assign(
+    {
+      title,
+      admins,
+      moderators,
+      stats,
+    },
+    model
+  );
 }
 
 module("Integration | Component | about-page", function (hooks) {
@@ -98,4 +102,44 @@ module("Integration | Component | about-page", function (hooks) {
         })
       );
   });
+
+  test("contact URL", async function (assert) {
+    let model = createModelObject({
+      contact_url: "www.example.com",
+    });
+
+    await render(<template><AboutPage @model={{model}} /></template>);
+
+    assert
+      .dom(".about__contact-info a")
+      .hasAttribute(
+        "href",
+        "//www.example.com",
+        "appends a double slash if the value doesn't start with a slash or a protocol"
+      );
+
+    model.contact_url = "/u/somebody";
+
+    await render(<template><AboutPage @model={{model}} /></template>);
+
+    assert
+      .dom(".about__contact-info a")
+      .hasAttribute(
+        "href",
+        "/u/somebody",
+        "doesn't append a double slash if the value starts with a slash"
+      );
+
+    model.contact_url = "https://example.com";
+
+    await render(<template><AboutPage @model={{model}} /></template>);
+
+    assert
+      .dom(".about__contact-info a")
+      .hasAttribute(
+        "href",
+        "https://example.com",
+        "doesn't append a double slash if the value starts with a protocol"
+      );
+  });
 });