AppShell
The App Shell is a major component of the Dynatrace platform. It provides a communication layer between the platform and your Dynatrace App.
When an app is running on the platform, it gets wrapped within an iframe
by the App Shell. That allows every app to run in its own context and rely on the App Shell to handle all the communication with the platform.
In particular it
- Handles cross-app communication (via intents and page tokens)
- Renders common parts of the Platform UI, including Dock, "Open with" dialog, and error views
- Synchronizes your app routing with the platform and browser
- Catches unhandled errors from your app and maintains the Platform stability
- Passes configuration info and user settings to your app
- Handles Platform security protocol
Since running apps within the iframe
context comes with some limitations during app development, it's important to follow the suggestions below:
- Use the Dynatrace App Toolkit to build and deploy your app
- Query Dynatrace data in your app using the functionality provided by the Dynatrace SDKs
- Use intents and page tokens to navigate between apps and avoid direct navigations to routes outside of your app boundaries
Local development
All the above-mentioned points have effects on your local development experience. The App Shell provides some convenient features to make your development experience as flawless as possible.
Access Dynatrace data during development
When starting your local development server, the Dynatrace App Toolkit automatically proxies all the requests to the Dynatrace platform to the environment specified in your app configuration file. Therefore, you can use data from your Dynatrace environment during the development phase to ensure that your app works correctly in the real-world environment.
Run your app outside of the iframe context
There are some cases during development where it can be beneficial to run your app outside of the iframe
context.
When your app is running within your local dev server, you can detach it from the App Shell to achieve this.
Select Detach in the bottom-left corner of your screen.
Note that when your app is detached, it can't access any App Shell functionalities and might behave differently than running inside the App Shell.
Using React Developer Tools
The React Developer Tools browser extension is a convenient way to debug your app, but it doesn't work correctly when the app runs inside the iframe
.
To make use of it, you run your app detached from the App Shell while using the extension. Just make sure to test it properly in regular mode to avoid inconsistencies.
Error handling
The App Shell catches all unhandled errors and displays a standard error view. In case your app doesn't yet handle all the errors properly, you can temporarily disable this behavior for the current session. in the standard error view, select Reload application and ignore all app errors in the current session.