Skip to main content


         This documentation site is for previous versions. Visit our new documentation site for current releases.      
 

Attributes in web embed

Updated on October 21, 2022
Applicable to Cosmos React applications

You can add a number of attributes to your web embed snippet to expand its functionality.

Note: To simplify the code, attributes with default values are removed from the automatically generated web embed snippet.

General

Note:
  • The web embed supports general HTML element attributes and methods, such as addEventListener. For more information, see the W3C HTML reference information.
  • For JSON objecs, use single quotes around the entire string representing the object contents.
NameDescriptionTypeDefault valueGenerated automatically
IdUnique ID for embedding element.Stringnone
deferLoadEmbedding is initially loaded as not shown.Booleanfalse
popupReauthIf true, the system prompts for re-authentication when the refresh token expires.Booleanfalse
casePageSpecifies which page to open. The following values are available:
full
Uses the full case page when displaying case-related UI.
assignment
Uses an alternate page, which constrains the UI to the assignment flow action area.
assignmentWithStages
Uses an alternate page, which constrains the UI to just the assignment flow action area and includes stages.
Constantassignment

Theme

NameDescriptionTypeDefault valueGenerated automatically
themeStringified JSON object that represents the theme of the web embed. The theme property is optional. JSON objectdefaults to the out-of-the-box Cosmos theme

The theme is a JSON Object that contains the value of the rule-ui-theme that you use to render the web embed. For more information on themes, see Defining themes.

For example: The following snippet contains sample values that you can set inside the theme:
{
  "base": {
    "palette": {
      "brand-primary": "#3c8712",
      "foreground-color": "#5e4242",
      "app-background": "#b1bde6"
    }
  }
}

You can pass the theme object as an attribute to the <pega-embed> tag. The object must be serialized and passed as a string:

<pega-embed id="theEmbed" action="https://docs-previous.pega.com/openPage" pageid="pyWorklist" pageclass="Data-Portal" appalias="enrollment1"
     pegaserverurl="https://X.X.X.X/prweb" staticcontenturl="https://Y.Y.Y.Y/c11n/"
      authservice="pega" clientid="11111111111111"
      theme='{"base":{"palette":{"brand-primary":"#3c8712","foreground-color":"#5e4242","border-line":"#5ac538","app-background":"#b1bde6"}}}'>
    </pega-embed>

Alternatively, you can pass the theme JSON object directly to the web component tag – either during creation of the <pega-embed> tag, or in conjunction with the ‘deferLoad’ attribute and the load function.

The following code illustrates an object passed directly during the creation of the web component tag:

var el = document.createElement("pega-embed");
el.theme= { "base": { "palette": { "brand-primary": "#3c8712", "foreground-color": "#5e4242", "app-background": "#b1bde6" } } };

The following code illustrates an object passed to the web component tag before calling the load method:

var el = document.getElementById("theEmbed")
el.theme= { "base": { "palette": { "brand-primary": "#3c8712", "foreground-color": "#5e4242", "app-background": "#b1bde6" } } };
el.load();

For more information, see JavaScript methods in web embed.

Action

NameDescriptionTypeDefault valueGenerated automatically
actionDefines the action that the web embed performs. The following values are available:
  • createCase
  • openCase
  • openAssignment
  • openPage
Constantnone
caseTypeIDID of the case type. Valid only for the createCase action.Stringnone
caseIDID of the case. Valid only for the openCase action.Stringnone
assignmentIDID of the case. Valid only for the openAssignment action.Stringnone
pageIDID of the page. Valid only for the openPage action.Stringnone
pageClassClass of the page. Valid only for the openPage action.Stringnone
startingFieldsStringified JSON object that represents additional values to pass to createCase. Valid only for the createCase action.Note: The fields you set in the startingFields attribute must be exposed in AllowedStartingFields. For more information, see Adding fields while creating cases in DX API v2.JSON objectnone
For example: The following snippet represents a startingFields JSON:
‘{"FirstName":"Adam","LastName":"Smith","Vehicle":{"Make":"Honda","Model":"Accord"}}’

You can pass the startingFields object as an attribute to the <pega-embed> tag. The object must be serialized and passed as a string:

<pega-embed id="theEmbed" action="https://docs-previous.pega.com/openPage" pageid="pyWorklist" pageclass="Data-Portal" appalias="enrollment1"
     pegaserverurl="https://X.X.X.X/prweb" staticcontenturl="https://Y.Y.Y.Y/c11n/"
      authservice="pega" clientid="11111111111111"
      startingFields=‘{"FirstName":"Adam","LastName":"Smith","Vehicle":{"Make":"Honda","Model":"Accord"}}’>
    </pega-embed>

Alternatively, you can pass the JSON object directly to the web component tag – either during creation of the <pega-embed> tag, or in conjunction with the ‘deferLoad’ attribute and the load function.

The following code illustrates an object passed directly during the creation of the web component tag:

var el = document.createElement("pega-embed");
el.startingFields=‘{"FirstName":"Adam","LastName":"Smith","Vehicle":{"Make":"Honda","Model":"Accord"}}’;

Configuration

NameDescriptionTypeDefault valueGenerated automatically
pegaServerUrlURL to the Pega Infinity server.Stringnone
staticContentUrlURL to the Constellation Static Content service, from where the system loads the UI engine code.Stringnone
appAliasThe alias of the embedded application.Note: If the appAlias argument is not specified, resulting REST endpoints cannot add the “app/appAlias” segments. In this case, the system does not support using non-primary Access Groups within an Operator record.Stringnone

Authentication

NameDescriptionTypeDefault valueGenerated automatically
authHeaderAuthentication header such as “Bearer <token>” that you use for DX API transactions invoked by the Constellation UI Service. The token is used to pass the authentication header. As a best practice, do not specify this, and use the ssKeyTokenInfo attribute instead. The system ignores the attribute if the ssKeyTokenInfo attribute is also specified.Stringnone
ssKeyTokenInfoKey name to use with the sessionStorage.getItem API to pass the token information to the embedding. The attribute should contain the JSON.stringify of the token endpoint response.

This attribute contains access_token, token_type, refresh_token and session_index values.

Stringnone
silentTimeoutSpecifies the number of milliseconds that the system waits for authentication to complete in a hidden iframe.

You can set the value to 0 to avoid an attempt to authorize the endpoint transaction in a hidden iframe. This setting is relevant for authentication services other than Pega.

Integer5000

OAuth 2.0

NameDescriptionTypeDefault valueGenerated automatically
clientIdClient ID from the OAuth 2.0 client registration record.Stringnone
redirectUriRedirect URI from the OAuth 2.0 client registration record. The URI is invoked after a successful visible authorization challenge. StringstaticContentUrl + “embed/auth.html”
authorizeUriOAuth 2.0 authorization end point.StringpegaServerUrl + “/PRRestService/oauth2/v1/” + authorize
tokenUriOAuth 2.0 token end point.StringpegaServerUrl + “/PRRestService/oauth2/v1/” + token
revokeUriOAuth 2.0 token revocation end point.StringpegaServerUrl + “/PRRestService/oauth2/v1/” + revoke
authServiceAuthentication Service Alias for invoking the authorize endpoint.Note: For more information on configuring external authentication services, see Creating an authentication service.Stringpega

Special attributes

Note: Not for production use. Special attributes are useful for testing and demo scenarios. You must use the attributes together, and they only work with the pega authentication service.
NameDescriptionTypeDefault valueGenerated automatically
userIdentifierThe user identifier value that you use to log in and generate OAuth access tokens.Stringnone
passwordThe password for the userIdentifier attribute encoded in base64. Stringnone

Have a question? Get answers now.

Visit the Support Center to ask questions, engage in discussions, share ideas, and help others.

Did you find this content helpful?

Want to help us improve this content?

We'd prefer it if you saw us at our best.

Pega.com is not optimized for Internet Explorer. For the optimal experience, please use:

Close Deprecation Notice
Contact us