umbraco-mocked-backoffice

Mock Umbraco backoffice API calls with MSW for visual testing.

26|13|Updated Nov 30, 2025
One-click install
npx skills add https://github.com/umbraco/Umbraco-CMS-Backoffice-Skills --skill umbraco-mocked-backoffice
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: umbraco-mocked-backoffice
Source: https://github.com/umbraco/Umbraco-CMS-Backoffice-Skills/tree/main/plugins/umbraco-testing-skills/skills/umbraco-mocked-backoffice
Command: npx skills add https://github.com/umbraco/Umbraco-CMS-Backoffice-Skills --skill umbraco-mocked-backoffice

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill allows developers to test Umbraco backoffice extensions visually without needing a running .NET backend, speeding up development and iteration cycles.

Core Features & Use Cases

  • Visual Testing: Test your extension's UI in a realistic environment.
  • Rapid Iteration: Make changes and see them reflected instantly without backend deployments.
  • CI/CD Integration: Run tests in automated pipelines without complex backend setup.
  • Demonstration: Showcase extensions without requiring a live Umbraco instance.

Quick Start

Use the umbraco-mocked-backoffice skill to set up your extension for visual testing.

Frequently Asked Questions about umbraco-mocked-backoffice

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I test Umbraco backoffice extensions without a running .NET backend?

You can test Umbraco backoffice extensions without a running .NET backend by mocking API calls using MSW or a mock repository pattern. This approach eliminates the need for a live server, enabling rapid UI iteration and visual testing.

How does mocking API calls with MSW work for Umbraco visual testing?

Mocking API calls with MSW intercepts network requests to provide simulated data, allowing the Umbraco UI to render realistically. This supports testing error handling, loading states, and data rendering within a controlled environment.

Can I run Umbraco extension tests in automated CI/CD pipelines?

Yes, you can run Umbraco extension tests in automated CI/CD pipelines. Mocking the API calls eliminates complex backend setup, allowing tests to execute seamlessly in automated environments without a live .NET instance.

Does visual testing for Umbraco extensions support testing loading states and error handling?

Yes, visual testing for Umbraco extensions supports testing loading states and error handling. By mocking API responses with MSW or a mock repository, you can simulate various data scenarios within a realistic Umbraco UI environment.

What is the best way to iterate on Umbraco UI without backend deployments?

The best way to iterate on Umbraco UI without backend deployments is to mock the API calls using MSW. This allows changes to be reflected instantly in a realistic environment, speeding up the development cycle.

Do I need a mock repository pattern to demonstrate Umbraco extensions without a live instance?

You can use either a mock repository pattern or MSW to demonstrate Umbraco extensions without a live instance. Both methods mock API calls to render the extension's UI realistically without requiring a live Umbraco deployment.