Hacktoberfest 2026：维护者为十月标记出来的 issue，仍然开放、适合新手。 浏览 Hacktoberfest issue

Feature request: host code apps inside model-driven apps (navigation, form tab/section, command dialogs), like custom pages

未关闭
  • 哪里不对？
#508 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

维护者通常 1 天内回复

还没有人认领这个 Issue。

评估

难度
5/5
预计耗时
一周以上
新手友好度
25/100
Issue 类型
功能
描述清晰度
描述清楚
活跃度
活跃
技术栈
typescript
领域
frontend, full-stack

调研方向

Start by reading how code apps currently receive host context through getContext() from @microsoft/power-apps/app, then compare that flow with the custom page integration points described in the issue. The request spans app navigation, form hosting, command navigation, authentication, and close/result behavior. Done means code apps can be hosted in all three places with authentication and record context passed through.

由索引模型根据 Issue 内容生成。

描述

bug
Summary

Custom pages can be used inside a model-driven app: as a page in the app's navigation, on a form, and as a dialog or side pane opened from a command. The model-driven app passes the user's authentication and the context (table, record id) to the page. Code apps can't do any of this today: they only run standalone in the Power Apps player.

Please let code apps be hosted by a model-driven app in the same three ways as custom pages, with the authentication and the context passed by the model-driven app:

  1. A code app as a page in the model-driven app: a code app in the app's site map (navigation), like a custom page, added in the app designer (Add page → Code app).
  2. A code app inside a form: in a form tab or section, with the current record passed to it (table + record id). This now can be done with a Canvas App - and with some out-of-the-box thinking with a page -
  3. A code app opened from a command: e.g. replacing the classic New / Edit buttons, as a dialog, side pane or full page (Xrm.Navigation.navigateTo), like a custom page can.

For all three: the model-driven app passes the authentication to the code app, just as it does for a custom page: no second sign-in, no extra consent, no separate player session.

Below a screenshot of the Model Driven App add Page option:
Image

Why
  • Code apps are the pro-code way to build rich UI on Dataverse (React, TypeScript, any UI library, tests, ALM in git). Many solutions combine a model-driven app (data maintenance, admin, views, business process) with focused screens for specific steps of a process. Today those screens have to be custom pages (low-code) or a separate code app the user opens in another tab.
  • Users expect one app: a focused screen should open where the user works — in the navigation, on the record's form, or from the command bar — not as a separate app with its own header, sign-in and navigation.
  • Replacing the classic New / Edit experience of a table with a guided code app screen (a wizard, a responsive form for the phone) is a common need. With custom pages this works (navigateTo with pageType: "custom"); with code apps it doesn't.
  • Code apps already run in a host (the player) that passes the user's context (getContext() from @microsoft/power-apps/app). The same model would work when the host is a model-driven app.
How it could work (suggestion)
Custom page today Code app (requested)
In the navigation Site map subarea / app designer Add page → Custom page Add page → Code app; the code app as an app module component
On a form A custom page in a form tab / section, record context passed A code app component in a form tab / section; getContext() returns the table and record id
From Legacy Buttons Xrm.Navigation.navigateTo({ pageType: "custom", name, entityName, recordId }, { target: 2, position: 1 / 2 })
Scott Durow approach:
https://www.youtube.com/watch?v=99uU5gGN15w		 navigateTo({ pageType: "codeapp", name, entityName, recordId, data }, { target: 1 / 2, position }) — full page, dialog or side pane
From a command Xrm.Navigation.navigateTo({ pageType: "custom", name, entityName, recordId }, { target: 2, position: 1 / 2 }) navigateTo({ pageType: "codeapp", name, entityName, recordId, data }, { target: 1 / 2, position }) — full page, dialog or side pane
Authentication Passed by the model-driven app Passed by the model-driven app — the code app's data sources and connections work without a new sign-in
Context in the app Param() in Power Fx
@ModelDrivenIntegration in Canvas or Page		 getContext() extended, e.g. host: "modelDrivenApp", appId, entityName, recordId, formType, custom data
Closing / result Back(), close the dialog An API to close the dialog / side pane and return a result (e.g. the new record id) so the form or view refreshes

Bonus: when a code app is shown inside a model-driven app, its own header is hidden automatically (the model-driven app's header is enough).

Additional Consideration

Yes I am aware that we can use custom components to add functionality to a dataverse form. But in my opinion it would make sense to streamline the experience over multiple usecases, therefor it would make sense to enable CodeApps to host the integration options of the Custom page, so it can be used in a wide area of usecases.

With adding this feature we as consultants and developers get extended choices on how to implement functionality. We can decide to go full low code - canvas apps and pages -, full pro code - with codeapps and (optional) custom components - or hybrid - all types based on the specific usecase -. This makes sense I hope.

Environment
  • Power Apps CLI pa 1.3.0, @microsoft/power-apps 1.5.0.
  • Code apps in a solution together with a model-driven app (unmanaged in dev, managed in test / production).
  • Today the only way to show a code app from a model-driven app is a link that opens it standalone in the player (a new tab, its own header and navigation, no record context except through URL parameters).
主要语言
TypeScript
星标
516
派生
145
平均合并
1 天 10 小时
30 天内合并 PR
23

环境准备

这个项目没有提供开发容器、Dockerfile 或贡献指南，环境需要你自己搭建：先看它的 README，通用步骤见我们的新手贡献指南。

从这里开始

  1. 先读完整个 Issue，再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库，在一个分支上完成修改。
  4. 提交 Pull Request，并在描述里引用这个 Issue 编号。

microsoft/PowerAppsCodeApps 的其他 Issue

查看 microsoft/PowerAppsCodeApps 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。