Agent skill

Maui Hybridwebview

by davidortinau in davidortinau/maui-skills

Guidance for embedding web content in .NET MAUI apps using HybridWebView, including JavaScript–C interop, bidirectional communication, raw messaging, and trimming/NativeAOT considerations.

MITAuto-check passedMobile

Install Maui Hybridwebview

skills CLI
$ npx skills add davidortinau/maui-skills --skill maui-hybridwebview -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install davidortinau/maui-skills maui-hybridwebview --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/davidortinau/maui-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/plugins/maui-skills/skills/maui-hybridwebview .claude/skills/maui-hybridwebview && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
maui-hybridwebview
GitHub stars
175
Token cost
~1.2k tokens
SKILL.md length
328 words
Files
2 (incl. references)
Skills in repo
41
Repo updated
First seen
Licence
MIT

At a glance

Guidance for embedding web content in .NET MAUI apps using HybridWebView, including JavaScript–C interop, bidirectional communication, raw messaging, and trimming/NativeAOT considerations.

  • : HybridWebView
  • SKILL.md covers Common gotchas, ⚠️ Bridge script is mandatory, JSON serialization — every… and SetInvokeJavaScriptTarget —…, plus 4 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
  • JavaScript interop

What it does

Maui Hybridwebview is an agent skill from davidortinau/maui-skills. Guidance for embedding web content in .NET MAUI apps using HybridWebView, including JavaScript–C interop, bidirectional communication, raw messaging, and trimming/NativeAOT considerations. USE FOR: "HybridWebView", "JavaScript interop", "embed web content", "JS to C interop", "C to JavaScript", "web view interop", "raw message", "InvokeJavaScriptAsync", "web content MAUI". DO NOT USE FOR: deep linking from external URLs (use maui-deep-linking), REST API calls (use maui-rest-api), or Blazor Hybrid apps (different…

Its SKILL.md is about 1.2k tokens, which your agent loads only when the skill is triggered. The skill folder holds 2 other files, including reference files (for example `references/hybridwebview-api.md`).

It sits in Mobile, covering Cross-platform mobile apps. It works with C#, JavaScript and Blazor. The repository describes itself as: .NET MAUI skills for GitHub Copilot and Claude Code. The licence is MIT.

When your agent uses it

  • : HybridWebView
  • JavaScript interop
  • Embed web content
  • JS to C interop

Example prompts

  • “HybridWebView”
  • “JavaScript interop”
  • “embed web content”
  • “/maui-hybridwebview”

What it can do on your machine

Read from SKILL.md and the folder at commit 79bb4bf. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are csharp, html and xml).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Maui Hybridwebview loads about 1.2k tokens when it runs, and up to ~2.3k if it reads all its reference files. Until then it costs about 140 tokens; SKILL.md has 328 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~140
When it runs · the whole SKILL.md, loaded when a task matches
~1.2k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~2.3k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from davidortinau/maui-skills at commit 79bb4bf, republished under its MIT licence (© davidortinau). 328 words, ~1,239 tokens.

Download SKILL.mdSave it as .claude/skills/maui-hybridwebview/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.
name
maui-hybridwebview
description
Guidance for embedding web content in .NET MAUI apps using HybridWebView, including JavaScript–C# interop, bidirectional communication, raw messaging, and trimming/NativeAOT considerations. USE FOR: "HybridWebView", "JavaScript interop", "embed web content", "JS to C# interop", "C# to JavaScript", "web view interop", "raw message", "InvokeJavaScriptAsync", "web content MAUI". DO NOT USE FOR: deep linking from external URLs (use maui-deep-linking), REST API calls (use maui-rest-api), or Blazor Hybrid apps (different from HybridWebView).

HybridWebView in .NET MAUI

HybridWebView hosts HTML/JS/CSS content inside a .NET MAUI app with bidirectional C#↔JS communication. It is not a general browser control — it is designed for local web content shipped with the app.

Common gotchas

IssueFix
Blank white screenWeb assets missing from Resources/Raw/wwwroot or DefaultFile not set
JS interop silently failsMissing <script src="_hwv/HybridWebView.js"></script> in HTML
InvokeJavaScriptAsync returns nullReturn type missing [JsonSerializable] attribute in JsonSerializerContext
JS → C# calls do nothingSetInvokeJavaScriptTarget not called before JS invokes C# methods
Serialization crash with trimmingNot using source-generated JsonSerializerContext

⚠️ Bridge script is mandatory

The HTML page must include the bridge script before any app scripts:

html
<!-- ✅ Correct order -->
<script src="_hwv/HybridWebView.js"></script>
<script src="scripts/app.js"></script>

<!-- ❌ Wrong — app.js loads before bridge, interop calls fail silently -->
<script src="scripts/app.js"></script>
<script src="_hwv/HybridWebView.js"></script>

JSON serialization — every type must be registered

Every parameter type and return type used in InvokeJavaScriptAsync must have a [JsonSerializable] entry:

csharp
// ✅ Correct — all interop types registered
[JsonSerializable(typeof(int))]
[JsonSerializable(typeof(string))]
[JsonSerializable(typeof(Person))]
internal partial class MyJsonContext : JsonSerializerContext { }

// ❌ Wrong — adding a new type to interop without registering it
// This causes silent null returns or runtime exceptions

Rule: When you add a new type to the interop surface, you must add a [JsonSerializable(typeof(T))] attribute to the context. Forgetting this is the #1 cause of mysterious interop failures.

SetInvokeJavaScriptTarget — timing matters

csharp
// ✅ Set target BEFORE the web page loads and JS calls C#
myHybridWebView.SetInvokeJavaScriptTarget(new MyJsBridge());

// ❌ Setting it after JS already tried to call — calls are lost

⚠️ Call SetInvokeJavaScriptTarget during page construction or OnAppearing, not lazily.

Exception handling (.NET 9+)

JS exceptions thrown during InvokeJavaScriptAsync are forwarded to .NET. Always wrap interop calls:

csharp
// ✅ Catches JS errors
try
{
    var result = await myHybridWebView.InvokeJavaScriptAsync<string>(
        "riskyFunction", MyJsonContext.Default.String);
}
catch (Exception ex)
{
    Debug.WriteLine($"JS error: {ex.Message}");
}

// ❌ Unhandled JS exception crashes the interop pipeline
var result = await myHybridWebView.InvokeJavaScriptAsync<string>(
    "riskyFunction", MyJsonContext.Default.String);

Trimming / NativeAOT pitfalls

Trimming is disabled by default in MAUI projects. If you enable it:

  • ⚠️ You must use source-generated JsonSerializerContext (not reflection-based serialization)
  • ⚠️ Set JsonSerializerIsReflectionEnabledByDefault to false
  • Using JsonSerializerContext as shown above is recommended regardless of trimming settings
xml
<PropertyGroup>
  <PublishTrimmed>true</PublishTrimmed>
  <JsonSerializerIsReflectionEnabledByDefault>false</JsonSerializerIsReflectionEnabledByDefault>
</PropertyGroup>

Decision framework — typed interop vs raw messages

NeedUse
Structured data exchange with type safetyInvokeJavaScriptAsync / InvokeDotNet with JsonSerializerContext
Simple string payloads, fire-and-forgetSendRawMessage / RawMessageReceived
Calling C# from JS with return valuesInvokeDotNet (target must be set first)
Multiple JS functions to callTyped interop — one InvokeJavaScriptAsync per function

Quick checklist

  • Web content is under Resources/Raw/wwwroot
  • index.html includes <script src="_hwv/HybridWebView.js"></script> before app scripts
  • DefaultFile is set (or defaults to index.html)
  • Every interop type has a [JsonSerializable] entry in a JsonSerializerContext
  • SetInvokeJavaScriptTarget is called before JS invokes C# methods
  • InvokeJavaScriptAsync calls are wrapped in try/catch (.NET 9+)
  • If trimming enabled: source-generated JSON serialization configured

© davidortinau, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 1 other file (references) in plugins/maui-skills/skills/maui-hybridwebview of davidortinau/maui-skills.

  • SKILL.md
  • references/hybridwebview-api.md

Open the folder on GitHubat commit 79bb4bf

Compare with similar skills

Maui Hybridwebview next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Maui Hybridwebview compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Maui Hybridwebview this skilldavidortinau/maui-skills175—~1.2kAutomated safety check: PassMIT
Maui Safe Areadotnet/skills5.6k1 repos~3.2kAutomated safety check: PassMIT
Wallet QuickstartNethereum/Nethereum2.3k—~1.6kAutomated safety check: PassMIT
Csharp Expertmicrosoft/testfx1k2 repos~5.4kAutomated safety check: PassMIT
Sentry Dotnet SDKgetsentry/sentry-for-ai268—~5.8kAutomated safety check: PassApache-2.0
Using Dotnetnovotnyllc/dotnet-artisan232—~2.3kAutomated safety check: WarnMIT

Similar skills

  • Maui Safe Area

    dotnet/skills

    Official

    .NET MAUI safe area and edge-to-edge layout guidance for .NET 10+.

    5.6k GitHub starsUsed in 1 repo~3.2k tokens
    MobileAuto-check passed
  • Wallet Quickstart

    Nethereum/Nethereum

    Build a multi-platform wallet application using the Nethereum Wallet SDK with MVVM architecture (.NET/C).

    2.3k GitHub stars~1.6k tokensUpdated 6 days ago
    MobileAuto-check passed
  • Csharp Expert

    microsoft/testfx

    Official

    Route C and .NET requests to the exact installed specialist or smallest dotnet/skills marketplace plugin.

    1k GitHub starsUsed in 2 repos~5.4k tokens
    DevelopmentAuto-check passed
  • Sentry Dotnet SDK

    getsentry/sentry-for-ai

    Official

    Full Sentry SDK setup for .NET. An agent skill from getsentry/sentry-for-ai.

    268 GitHub stars~5.8k tokensUpdated yesterday
    Productivity & AutomationAuto-check passed
  • Using Dotnet

    novotnyllc/dotnet-artisan

    Detects .NET intent for any C, ASP.NET Core, EF Core, Blazor, MAUI, Uno Platform, WPF, WinUI, SignalR, gRPC, xUnit, NuGet, or MSBuild request from prompt keywords and repository signals (.sln…

    232 GitHub stars~2.3k tokensUpdated 3 days ago
    Backend & APIsAuto-check: warnings
  • Use JS Interop

    dotnet/skills

    Official

    Add, review, or fix JavaScript interop in Blazor components.

    5.6k GitHub starsUsed in 1 repo~2.7k tokens
    Backend & APIsAuto-check passed

More from davidortinau/maui-skills

All 41 skills in this repo
  • Maui Hot Reload Diagnostics

    davidortinau/maui-skills

    Diagnose and troubleshoot .NET MAUI Hot Reload issues (C Hot Reload, XAML Hot Reload, Blazor Hybrid).

    175 GitHub stars~1.3k tokensUpdated 3 mo ago
    Auto-check passed
  • Maui Accessibility

    davidortinau/maui-skills

    Guide for making .NET MAUI apps accessible — screen reader support via SemanticProperties, heading levels, AutomationProperties visibility control, programmatic focus and announcements, and…

    175 GitHub stars~974 tokensUpdated 3 mo ago
    Auto-check passed
  • Maui Animations

    davidortinau/maui-skills

    .NET MAUI view animations, custom animations, easing functions, rotation, scale, translation, and fade effects.

    175 GitHub stars~911 tokensUpdated 3 mo ago
    Auto-check passed
  • Maui App Icons Splash

    davidortinau/maui-skills

    .NET MAUI app icon configuration, splash screen setup, SVG to PNG conversion at build time, composed/adaptive icons, and platform-specific icon and splash screen requirements for Android, iOS, Mac…

    175 GitHub stars~995 tokensUpdated 3 mo ago
    Auto-check passed
  • Maui App Lifecycle

    davidortinau/maui-skills

    .NET MAUI app lifecycle guidance covering the four app states (not running, running, deactivated, stopped), cross-platform Window lifecycle events, backgrounding and resume behaviour…

    175 GitHub stars~947 tokensUpdated 3 mo ago
    Auto-check passed
  • Maui Aspire

    davidortinau/maui-skills

    Guide for .NET MAUI apps consuming .NET Aspire-hosted backend services.

    175 GitHub stars~1.3k tokensUpdated 3 mo ago
    Auto-check passed

Categories

Questions about Maui Hybridwebview

What does Maui Hybridwebview do?

Guidance for embedding web content in .NET MAUI apps using HybridWebView, including JavaScript–C interop, bidirectional communication, raw messaging, and trimming/NativeAOT considerations. Maui Hybridwebview is an agent skill from davidortinau/maui-skills.NET MAUI apps using HybridWebView, including JavaScript–C interop, bidirectional communication, raw messaging, and trimming/NativeAOT considerations.

When should I use Maui Hybridwebview?

Maui Hybridwebview fits situations like: : HybridWebView; javaScript interop; embed web content; JS to C interop.

How do I install Maui Hybridwebview in Claude Code?

Run `npx skills add davidortinau/maui-skills --skill maui-hybridwebview -a claude-code`. Or copy the skill folder (plugins/maui-skills/skills/maui-hybridwebview in davidortinau/maui-skills) into .claude/skills/maui-hybridwebview in your project. Claude Code loads it when a task matches its description.

How do I install Maui Hybridwebview in Codex?

Run `npx skills add davidortinau/maui-skills --skill maui-hybridwebview -a codex`. Or copy the skill folder (plugins/maui-skills/skills/maui-hybridwebview in davidortinau/maui-skills) into .agents/skills/maui-hybridwebview in your project. Codex loads it when a task matches its description.

Can I use Maui Hybridwebview in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add davidortinau/maui-skills --skill maui-hybridwebview -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/maui-hybridwebview, .gemini/skills/maui-hybridwebview, .github/skills/maui-hybridwebview and .opencode/skills/maui-hybridwebview in your project.

What does Maui Hybridwebview need to run?

SKILL.md names no scripts, command-line tools or credentials: Maui Hybridwebview is instructions for the agent only.

Does Maui Hybridwebview access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Maui Hybridwebview safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Maui Hybridwebview use?

Maui Hybridwebview is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Maui Hybridwebview use?

About 1.2k tokens (SKILL.md is roughly 5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 1.1k tokens, read only when the agent opens those files.

What are the alternatives to Maui Hybridwebview?

Skills that share tags, products or a category with Maui Hybridwebview: Maui Safe Area (dotnet/skills, 5.6k stars), Wallet Quickstart (Nethereum/Nethereum, 2.3k stars), Csharp Expert (microsoft/testfx, 1k stars) and Sentry Dotnet SDK (getsentry/sentry-for-ai, 268 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Maui Hybridwebview?

davidortinau (a GitHub user) maintains it in davidortinau/maui-skills, which has 175 GitHub stars. The repository holds 41 skills in this directory. The repository was last updated on July 6, 2026.

Source: davidortinau/maui-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.