The SPA front-end helper libraries provide APIs through which you can stay informed about the status of the current renderer context of an SPA page. The status can be that your SPA page is running in:
- A developer mode.
- The Pages editor.
- The preview mode of the Pages editor.
Being aware of the current renderer context can be useful if you need to hit different URLs for content, do rendering or other things conditionally. The status information is retrievable in the Angular and React frameworks.
In Angular
If you call the isDevMode()
function, which is part of the @angular/core
library, and the developer mode is enabled, you can see the status as a comment in the DOM element.
To find out whether your SPA page is running in the Pages editor or in its page preview mode, inject the RendererContextService
from the @magnolia/angular-renderer
. You can then call the following functions to get the status:
inEditor()
inEditorPreview()
In React
To retrieve the status in React, make sure that you import {RendererContext}
from the @magnolia/react-renderer
, and that the class of YourComponent
extends the React.Component
.
After assigning static contextType = RendererContext
you can call the following functions to get the status:
this.context.isDevMode
this.context.inEditor
this.context.inEditorPreview