✨ PreactBaseElement['staticProps'] (#30380)

Related to #30280
ampproject · Sep 25, 2020 · cddb53b · cddb53b
1 parent be0bf7c
commit cddb53b
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 3 deletions.
diff --git a/src/preact/base-element.js b/src/preact/base-element.js
@@ -194,10 +194,14 @@ export class PreactBaseElement extends AMP.BaseElement {
       ...templatesInit,
     });
 
+    const staticProps = Ctor['staticProps'];
     const initProps = this.init();
-    if (initProps) {
-      Object.assign(/** @type {!Object} */ (this.defaultProps_), initProps);
-    }
+    Object.assign(
+      /** @type {!Object} */ (this.defaultProps_),
+      staticProps,
+      initProps
+    );
+
     this.checkPropsPostMutations();
 
     // Unblock rendering on first `CanRender` response. And keep the context
@@ -546,6 +550,12 @@ PreactBaseElement['Component'] = function () {
   devAssert(false, 'Must provide Component');
 };
 
+/**
+ * If default props are static, this can be used instead of init().
+ * @protected {!JsonObject|undefined}
+ */
+PreactBaseElement['staticProps'] = undefined;
+
 /**
  * @protected {!Array<!ContextProp>}
  */

diff --git a/test/unit/preact/test-base-element-mapping.js b/test/unit/preact/test-base-element-mapping.js
@@ -166,6 +166,34 @@ describes.realWin('PreactBaseElement', {amp: true}, (env) => {
     });
   });
 
+  describe('props with staticProps', () => {
+    let element;
+
+    const initProps = {x: 'x', tacos: true};
+
+    beforeEach(async () => {
+      Impl.prototype.init = () => initProps;
+      Impl['staticProps'] = {
+        a: 'a',
+        b: 123,
+      };
+      element = html`
+        <amp-preact layout="fixed" width="100" height="100"></amp-preact>
+      `;
+      doc.body.appendChild(element);
+      await element.build();
+      await waitFor(() => component.callCount > 0, 'component rendered');
+    });
+
+    it('include staticProps', () => {
+      expect(lastProps).to.include(Impl['staticProps']);
+    });
+
+    it('include init() props', () => {
+      expect(lastProps).to.include(initProps);
+    });
+  });
+
   describe('usesTemplate', () => {
     let element;