✅ buildDom: add tests for amp-fit-text and amp-layout (#35494)

* buildDom: add tests for amp-fit-text and amp-layout * remove chai
ampproject · Aug 3, 2021 · 42c553e · 42c553e
1 parent 8d0c2f7
commit 42c553e
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 3 deletions.
diff --git a/extensions/amp-fit-text/0.1/amp-fit-text.js b/extensions/amp-fit-text/0.1/amp-fit-text.js
@@ -32,7 +32,7 @@ const MEASURER_CLASS = 'i-amphtml-fit-text-measurer';
 const CONTENT_CLASS = 'i-amphtml-fit-text-content';
 const CONTENT_WRAPPER_CLASS = 'i-amphtml-fit-text-content-wrapper';
 
-class AmpFitText extends AMP.BaseElement {
+export class AmpFitText extends AMP.BaseElement {
   /** @override @nocollapse */
   static prerenderAllowed() {
     return true;

diff --git a/extensions/amp-fit-text/0.1/test/test-amp-fit-text.js b/extensions/amp-fit-text/0.1/test/test-amp-fit-text.js
@@ -14,7 +14,13 @@
  * limitations under the License.
  */
 
-import {calculateFontSize_, updateOverflow_} from '../amp-fit-text';
+import {createElementWithAttributes} from '#core/dom';
+import {
+  AmpFitText,
+  buildDom,
+  calculateFontSize_,
+  updateOverflow_,
+} from '../amp-fit-text';
 
 describes.realWin(
   'amp-fit-text component',
@@ -53,6 +59,19 @@ describes.realWin(
         .then(() => ft);
     }
 
+    it('buildDom and buildCallback should result in the same outerHTML', async () => {
+      const fitText1 = createElementWithAttributes(doc, 'amp-fit-text', {
+        width: '111px',
+        height: '222px',
+      });
+      const fitText2 = fitText1.cloneNode(/* deep */ true);
+
+      new AmpFitText(fitText1).buildCallback();
+      buildDom(fitText2);
+
+      expect(fitText1.outerHTML).to.equal(fitText2.outerHTML);
+    });
+
     it('renders', () => {
       const text = 'Lorem ipsum';
       return getFitText(text).then((ft) => {

diff --git a/src/builtins/amp-layout/amp-layout.js b/src/builtins/amp-layout/amp-layout.js
@@ -22,7 +22,7 @@ import {registerElement} from '#service/custom-element-registry';
 import {BaseElement} from '../../base-element';
 import {getEffectiveLayout} from '../../static-layout';
 
-class AmpLayout extends BaseElement {
+export class AmpLayout extends BaseElement {
   /** @override @nocollapse */
   static prerenderAllowed() {
     return true;

diff --git a/test/unit/builtins/test-amp-layout.js b/test/unit/builtins/test-amp-layout.js
@@ -16,6 +16,7 @@
 
 import {createElementWithAttributes} from '#core/dom';
 import {Layout} from '#core/dom/layout';
+import {AmpLayout, buildDom} from '#builtins/amp-layout/amp-layout';
 
 describes.realWin('amp-layout', {amp: true}, (env) => {
   async function getAmpLayout(attrs, innerHTML) {
@@ -55,4 +56,21 @@ describes.realWin('amp-layout', {amp: true}, (env) => {
     expect(ampLayout.childNodes).have.length(2);
     expect(ampLayout.innerHTML).equal(children);
   });
+
+  it('buildDom and buildCallback should result in the same outerHTML', () => {
+    const layout1 = createElementWithAttributes(
+      env.win.document,
+      'amp-layout',
+      {
+        width: 100,
+        height: 100,
+      }
+    );
+    const layout2 = layout1.cloneNode(/* deep */ true);
+
+    new AmpLayout(layout1).buildCallback();
+    buildDom(layout2);
+
+    expect(layout1.outerHTML).to.equal(layout2.outerHTML);
+  });
 });