Implement provider-root attribute to "terminate" provider events

packages/app-shell/README.md

@@ -27,6 +27,10 @@ You need Keycloak and other parts to be in place to really make full use of the
 Best take a look on examples like [index.html](https://gitlab.tugraz.at/dbp/esign/signature/-/blob/master/examples/dbp-signature/index.html)
 for more explanation.
 
+You need to set the `provider-root` attribute for the app-shell to "terminate" all provider events.
+If you don't want to set the app-shell as `provider-root` then you need to set the attributes `auth`,
+`requested-login-status` and `analytics-event` as attribute for the app-shell or in a `dbp-provider` above it.
+
 ## Attributes
 
 - `lang` (optional, default: `de`): set to `de` or `en` for German or English

packages/app-shell/src/app-shell.js

@@ -69,19 +69,6 @@ export class AppShell extends ScopedElementsMixin(DBPLitElement) {
         this._attrObserver = new MutationObserver(this.onAttributeObserved);
 
         this.auth = {};
-
-        // We need to "provider-terminate" these two attributes in the app-shell, but we
-        // don't want to force system integrators to add those attributes to the app-shell tag.
-        // Unfortunately we also need to be able to react to those properties outside the render() function,
-        // so we can't use a dbp-provider to terminate these attributes in the render() function.
-        this.setProperty('auth', {});
-        this.setProperty('analytics-event', {});
-
-        // We need to "provider-terminate" this attribute in the app-shell as well, and we also
-        // don't want to force system integrators to add this attribute to the app-shell tag.
-        // But for this attribute we could use a dbp-provider, because we only need it in the render() function,
-        // but we can also handle it like the two attributes above and spare us the use of a dbp-provider.
-        this.setProperty('requested-login-status', {});
     }
 
     static get scopedElements() {

packages/common/src/adapter-lit-element.js

@@ -83,7 +83,7 @@ export class AdapterLitElement extends LitElement {
 
         this.addEventListener('dbp-subscribe', function (e) {
             const name = e.detail.name;
-            if (that.hasProperty(name) || that.root) {
+            if (that.hasProperty(name) || that.providerRoot) {
                 Logger.debug('AdapterLitElementProvider(' + that.tagName + ') eventListener("dbp-subscribe",..) name "' + name + '" found.');
                 that.callbackStore.push({name: name, callback: e.detail.callback, sender: e.detail.sender});
 
@@ -95,7 +95,7 @@ export class AdapterLitElement extends LitElement {
         this.addEventListener('dbp-unsubscribe', function (e) {
             const name = e.detail.name;
             const sender = e.detail.sender;
-            if (that.hasProperty(name) || that.root) {
+            if (that.hasProperty(name) || that.providerRoot) {
                 Logger.debug('AdapterLitElementProvider(' + that.tagName + ') eventListener("dbp-unsubscribe",..) name "' + name + '" found.');
                 that.callbackStore.forEach(item => {
                     if (item.sender === sender && item.name === name) {
@@ -114,7 +114,7 @@ export class AdapterLitElement extends LitElement {
             const name = e.detail.name;
             const value = e.detail.value;
 
-            if (that.hasProperty(name) || that.root) {
+            if (that.hasProperty(name) || that.providerRoot) {
                 Logger.debug('AdapterLitElementProvider(' + that.tagName + ') eventListener("dbp-set-property",..) name "' + name + '" found.');
                 that.setProperty(name, value);
 
@@ -239,8 +239,10 @@ export class AdapterLitElement extends LitElement {
 
     static get properties() {
         return {
+            ...super.properties,
             subscribe: { type: String },
             unsubscribe: { type: String },
+            providerRoot: { type: Boolean, attribute: 'provider-root' },
         };
     }