feat(butil): add missing members of Document class in Butil #6350 (#6353

)

src/Butil/Bit.Butil.Demo/Pages/DocumentPage.razor

@@ -14,18 +14,33 @@
     ...
     await document.AddEventListener(ButilEvents.Click, args => { ... });
     ...
+    await document.SetTitle("New shinny title");
+    ...
 }
 </pre>
 
-<h3>Open the DevTools and start clicking on page</h3>
+<br />
+<hr />
+
+<h3>Open the DevTools and start clicking</h3>
+
+<hr />
+<br />
 
 <button @onclick=AddEventListener>AddEventListener</button>
 &nbsp;
 <button @onclick=RemoveEventListener>RemoveEventListener</button>
+<br />
+<div>Is Registered: @isRegistered</div>
 
+<br />
 <hr />
+<br />
 
-<div>Is Registered: @isRegistered</div>
+<button @onclick=GetTitle>Document Title</button>
+<br />
+<br />
+<button @onclick=GetUrl>Document URL</button>
 
 @code {
     private bool isRegistered = false;
@@ -51,6 +66,16 @@
         isRegistered = false;
     }
 
+    private async Task GetTitle()
+    {
+        await console.Log("document.title =", await document.GetTitle());
+    }
+
+    private async Task GetUrl()
+    {
+        await console.Log("document.URL =", await document.GetUrl());
+    }
+
     public void Dispose()
     {
         if (isRegistered)

src/Butil/Bit.Butil/Internals/JsInterops/DocumentJsInterop.cs

@@ -0,0 +1,67 @@
+using System.Threading.Tasks;
+using Microsoft.JSInterop;
+
+namespace Bit.Butil;
+
+internal static class DocumentJsInterop
+{
+    internal static async Task<string> DocumentGetCharacterSet(this IJSRuntime js)
+        => await js.InvokeAsync<string>("BitButil.document.characterSet");
+
+    internal static async Task<CompatMode> DocumentGetCompatMode(this IJSRuntime js)
+    {
+        var mode = await js.InvokeAsync<string>("BitButil.document.compatMode");
+        return mode switch
+        {
+            "BackCompat" => CompatMode.BackCompat,
+            _ => CompatMode.CSS1Compat
+        };
+    }
+
+    internal static async Task<string> DocumentGetContentType(this IJSRuntime js)
+        => await js.InvokeAsync<string>("BitButil.document.contentType");
+
+    internal static async Task<string> DocumentGetDocumentURI(this IJSRuntime js)
+        => await js.InvokeAsync<string>("BitButil.document.documentURI");
+
+    internal static async Task<DesignMode> DocumentGetDesignMode(this IJSRuntime js)
+    {
+        var mode = await js.InvokeAsync<string>("BitButil.document.getDesignMode");
+        return mode switch
+        {
+            "on" => DesignMode.On,
+            _ => DesignMode.Off
+        };
+    }
+    internal static async Task DocumentSetDesignMode(this IJSRuntime js, DesignMode mode)
+        => await js.InvokeVoidAsync("BitButil.document.setDesignMode", mode);
+
+    internal static async Task<DocumentDir> DocumentGetDir(this IJSRuntime js)
+    {
+        var mode = await js.InvokeAsync<string>("BitButil.document.getDir");
+        return mode switch
+        {
+            "rtl" => DocumentDir.Rtl,
+            _ => DocumentDir.Ltr
+        };
+    }
+    internal static async Task DocumentSetDir(this IJSRuntime js, DocumentDir dir)
+        => await js.InvokeVoidAsync("BitButil.document.setDir", dir);
+
+    internal static async Task<string> DocumentGetReferrer(this IJSRuntime js)
+        => await js.InvokeAsync<string>("BitButil.document.referrer");
+
+    internal static async Task<string> DocumentGetTitle(this IJSRuntime js)
+        => await js.InvokeAsync<string>("BitButil.document.getTitle");
+    internal static async Task DocumentSetTitle(this IJSRuntime js, string title)
+        => await js.InvokeVoidAsync("BitButil.document.setTitle", title);
+
+    internal static async Task<string> DocumentGetUrl(this IJSRuntime js)
+        => await js.InvokeAsync<string>("BitButil.document.URL");
+
+    internal static async Task DocumentExitFullscreen(this IJSRuntime js)
+        => await js.InvokeVoidAsync("BitButil.document.exitFullscreen");
+
+    internal static async Task DocumentExitPointerLock(this IJSRuntime js)
+        => await js.InvokeVoidAsync("BitButil.document.exitPointerLock");
+}

src/Butil/Bit.Butil/Internals/JsInterops/ElementJsInterop.cs

@@ -141,24 +141,24 @@ internal static async Task ElementSetContentEditable(this IJSRuntime js, Element
     internal static async Task<bool> ElementIsContentEditable(this IJSRuntime js, ElementReference element)
         => await js.InvokeAsync<bool>("BitButil.element.isContentEditable", element);
 
-    internal static async Task<Dir> ElementGetDir(this IJSRuntime js, ElementReference element)
+    internal static async Task<ElementDir> ElementGetDir(this IJSRuntime js, ElementReference element)
     {
         var value = await js.InvokeAsync<string>("BitButil.element.getDir", element);
         return value switch
         {
-            "ltr" => Dir.Ltr,
-            "rtl" => Dir.Rtl,
-            "auto" => Dir.Auto,
-            _ => Dir.NotSet,
+            "ltr" => ElementDir.Ltr,
+            "rtl" => ElementDir.Rtl,
+            "auto" => ElementDir.Auto,
+            _ => ElementDir.NotSet,
         };
     }
-    internal static async Task ElementSetDir(this IJSRuntime js, ElementReference element, Dir value)
+    internal static async Task ElementSetDir(this IJSRuntime js, ElementReference element, ElementDir value)
     {
         var v = value switch
         {
-            Dir.Ltr => "ltr",
-            Dir.Rtl => "rtl",
-            Dir.Auto => "auto",
+            ElementDir.Ltr => "ltr",
+            ElementDir.Rtl => "rtl",
+            ElementDir.Auto => "auto",
             _ => "",
         };
         await js.InvokeVoidAsync("BitButil.element.setDir", element, v);

src/Butil/Bit.Butil/Publics/Document.cs

@@ -14,12 +14,117 @@ public async Task AddEventListener<T>(
         bool useCapture = false,
         bool preventDefault = false,
         bool stopPropagation = false)
-    {
-        await DomEventDispatcher.AddEventListener(js, ElementName, domEvent, listener, useCapture, preventDefault, stopPropagation);
-    }
+        => await DomEventDispatcher.AddEventListener(js, ElementName, domEvent, listener, useCapture, preventDefault, stopPropagation);
 
     public async Task RemoveEventListener<T>(string domEvent, Action<T> listener, bool useCapture = false)
-    {
-        await DomEventDispatcher.RemoveEventListener(js, ElementName, domEvent, listener, useCapture);
-    }
+        => await DomEventDispatcher.RemoveEventListener(js, ElementName, domEvent, listener, useCapture);
+
+    /// <summary>
+    /// Returns the character set being used by the document.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/characterSet">https://developer.mozilla.org/en-US/docs/Web/API/Document/characterSet</see>
+    /// </summary>
+    public async Task<string> GetCharacterSet()
+        => await js.DocumentGetCharacterSet();
+
+    /// <summary>
+    /// Indicates whether the document is rendered in quirks or strict mode.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/compatMode">https://developer.mozilla.org/en-US/docs/Web/API/Document/compatMode</see>
+    /// </summary>
+    public async Task<CompatMode> GetCompatMode()
+        => await js.DocumentGetCompatMode();
+
+    /// <summary>
+    /// Returns the Content-Type from the MIME Header of the current document.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/contentType">https://developer.mozilla.org/en-US/docs/Web/API/Document/contentType</see>
+    /// </summary>
+    public async Task<string> GetContentType()
+        => await js.DocumentGetContentType();
+
+    /// <summary>
+    /// Returns the document location as a string.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/documentURI">https://developer.mozilla.org/en-US/docs/Web/API/Document/documentURI</see>
+    /// </summary>
+    public async Task<string> GetDocumentURI()
+        => await js.DocumentGetDocumentURI();
+
+    /// <summary>
+    /// Gets ability to edit the whole document.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/designMode">https://developer.mozilla.org/en-US/docs/Web/API/Document/designMode</see>
+    /// </summary>
+    public async Task<DesignMode> GetDesignMode()
+        => await js.DocumentGetDesignMode();
+    /// <summary>
+    /// Sets ability to edit the whole document.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/designMode">https://developer.mozilla.org/en-US/docs/Web/API/Document/designMode</see>
+    /// </summary>
+    public async Task SetDesignMode(DesignMode mode)
+        => await js.DocumentSetDesignMode(mode);
+
+    /// <summary>
+    /// Gets directionality (rtl/ltr) of the document.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/dir">https://developer.mozilla.org/en-US/docs/Web/API/Document/dir</see>
+    /// </summary>
+    public async Task<DocumentDir> GetDir()
+        => await js.DocumentGetDir();
+    /// <summary>
+    /// Sets directionality (rtl/ltr) of the document.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/dir">https://developer.mozilla.org/en-US/docs/Web/API/Document/dir</see>
+    /// </summary>
+    public async Task SetDir(DocumentDir dir)
+        => await js.DocumentSetDir(dir);
+
+    /// <summary>
+    /// Returns the URI of the page that linked to this page.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/referrer">https://developer.mozilla.org/en-US/docs/Web/API/Document/referrer</see>
+    /// </summary>
+    public async Task<string> GetReferrer()
+        => await js.DocumentGetReferrer();
+
+    /// <summary>
+    /// Gets the title of the current document.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/title">https://developer.mozilla.org/en-US/docs/Web/API/Document/title</see>
+    /// </summary>
+    public async Task<string> GetTitle()
+        => await js.DocumentGetTitle();
+    /// <summary>
+    /// Sets the title of the current document.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/title">https://developer.mozilla.org/en-US/docs/Web/API/Document/title</see>
+    /// </summary>
+    public async Task SetTitle(string title)
+        => await js.DocumentSetTitle(title);
+
+    /// <summary>
+    /// Returns the document location as a string.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/URL">https://developer.mozilla.org/en-US/docs/Web/API/Document/URL</see>
+    /// </summary>
+    public async Task<string> GetUrl()
+        => await js.DocumentGetUrl();
+
+    /// <summary>
+    /// Stops document's fullscreen element from being displayed fullscreen.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/exitFullscreen">https://developer.mozilla.org/en-US/docs/Web/API/Document/exitFullscreen</see>
+    /// </summary>
+    public async Task ExitFullscreen()
+        => await js.DocumentExitFullscreen();
+
+    /// <summary>
+    /// Release the pointer lock.
+    /// <br />
+    /// <see href="https://developer.mozilla.org/en-US/docs/Web/API/Document/exitPointerLock">https://developer.mozilla.org/en-US/docs/Web/API/Document/exitPointerLock</see>
+    /// </summary>
+    public async Task ExitPointerLock()
+        => await js.DocumentExitPointerLock();
 }

src/Butil/Bit.Butil/Publics/Document/CompatMode.cs

@@ -0,0 +1,14 @@
+namespace Bit.Butil;
+
+public enum CompatMode
+{
+    /// <summary>
+    /// The document is in quirks mode.
+    /// </summary>
+    BackCompat,
+
+    /// <summary>
+    /// The document is in no-quirks (also known as "standards") mode or limited-quirks (also known as "almost standards") mode.
+    /// </summary>
+    CSS1Compat
+}

src/Butil/Bit.Butil/Publics/Document/DesignMode.cs

@@ -0,0 +1,14 @@
+namespace Bit.Butil;
+
+public enum DesignMode
+{
+    /// <summary>
+    /// The document's design mode is off (default).
+    /// </summary>
+    Off,
+
+    /// <summary>
+    /// The document is in design mode and the entire document is editable.
+    /// </summary>
+    On
+}

src/Butil/Bit.Butil/Publics/Document/DocumentDir.cs

@@ -0,0 +1,14 @@
+namespace Bit.Butil;
+
+public enum DocumentDir
+{
+    /// <summary>
+    /// Left to right (default).
+    /// </summary>
+    Ltr,
+
+    /// <summary>
+    /// Right to left.
+    /// </summary>
+    Rtl
+}

src/Butil/Bit.Butil/Publics/Element.cs

@@ -293,12 +293,12 @@ public async Task<bool> IsContentEditable(ElementReference element)
     /// <summary>
     /// The HTMLElement.dir property gets or sets the text writing directionality of the content of the current element.
     /// </summary>
-    public async Task<Dir> GetDir(ElementReference element)
+    public async Task<ElementDir> GetDir(ElementReference element)
         => await js.ElementGetDir(element);
     /// <summary>
     /// The HTMLElement.dir property gets or sets the text writing directionality of the content of the current element.
     /// </summary>
-    public async Task SetDir(ElementReference element, Dir value)
+    public async Task SetDir(ElementReference element, ElementDir value)
         => await js.ElementSetDir(element, value);
 
     /// <summary>

src/Butil/Bit.Butil/Publics/Element/Dir.cs → src/Butil/Bit.Butil/Publics/Element/ElementDir.cs

@@ -1,6 +1,6 @@
 namespace Bit.Butil;
 
-public enum Dir
+public enum ElementDir
 {
     /// <summary>
     /// The dir value is not set.

src/Butil/Bit.Butil/Scripts/document.ts

@@ -0,0 +1,23 @@
+var BitButil = BitButil || {};
+
+(function (butil: any) {
+    const _handlers = {};
+
+    butil.document = {
+        characterSet() { return document.characterSet },
+        compatMode() { return document.compatMode },
+        contentType() { return document.contentType },
+        documentURI() { return document.documentURI },
+        getDesignMode() { return document.designMode },
+        setDesignMode(value: string) { document.designMode = value },
+        getDir() { return document.dir },
+        setDir(value: string) { document.dir = value },
+        referrer() { return document.referrer },
+        getTitle() { return document.title },
+        URL() { return document.URL },
+        setTitle(value: string) { document.title = value },
+        exitFullscreen() { return document.exitFullscreen() },
+        exitPointerLock() { return document.exitPointerLock() },
+
+    };
+}(BitButil));