From fd2530897dd0e135d9faafe7827f750e86e53006 Mon Sep 17 00:00:00 2001
From: Michael Ficarra <m.ficarra@f5.com>
Date: Wed, 20 Nov 2024 17:41:26 -0700
Subject: [PATCH] add a meta tag to set viewport options for mobile devices

---
 src/Spec.ts | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/Spec.ts b/src/Spec.ts
index bb072e49..b05a3685 100644
--- a/src/Spec.ts
+++ b/src/Spec.ts
@@ -571,7 +571,8 @@ export default class Spec {
     this.buildReferenceGraph();
 
     this.highlightCode();
-    this.setCharset();
+    this.setMetaCharset();
+    this.setMetaViewport();
     const wrapper = this.buildSpecWrapper();
 
     let commonEles: HTMLElement[] = [];
@@ -1875,7 +1876,7 @@ ${this.opts.multipage ? `<li><span>Navigate to/from multipage</span><code>m</cod
   }
 
   /** @internal */
-  public setCharset() {
+  public setMetaCharset() {
     let current = this.spec.doc.querySelector('meta[charset]');
 
     if (!current) {
@@ -1886,6 +1887,18 @@ ${this.opts.multipage ? `<li><span>Navigate to/from multipage</span><code>m</cod
     current.setAttribute('charset', 'utf-8');
   }
 
+  /** @internal */
+  public setMetaViewport() {
+    let current = this.spec.doc.querySelector('meta[name=viewport]');
+
+    if (!current) {
+      let metaViewport = this.spec.doc.createElement('meta');
+      metaViewport.setAttribute('name', 'viewport');
+      metaViewport.setAttribute('content', 'width=device-width, initial-scale=1');
+      this.spec.doc.head.insertBefore(metaViewport, this.spec.doc.head.firstChild);
+    }
+  }
+
   private _updateBySelector(selector: string, contents: string) {
     const elem = this.doc.querySelector(selector);
     if (elem && elem.textContent!.trim().length > 0) {