test: add test to confirm observedAttributes behavior (#2973)

packages/@lwc/integration-karma/test/component/observed-attributes/index.spec.js

@@ -0,0 +1,37 @@
+import { createElement } from 'lwc';
+import Observes from 'x/observes';
+
+const SUPPORTS_CUSTOM_ELEMENTS = !process.env.COMPAT && 'customElements' in window;
+
+if (SUPPORTS_CUSTOM_ELEMENTS) {
+    describe('observed attributes', () => {
+        const constructorMethods = {
+            CustomElementConstructor: () => {
+                customElements.define(
+                    'x-observes-as-custom-element',
+                    Observes.CustomElementConstructor
+                );
+                const elm = document.createElement('x-observes-as-custom-element');
+                document.body.appendChild(elm);
+                return elm;
+            },
+            createElement: () => {
+                const elm = createElement('x-observes', { is: Observes });
+                document.body.appendChild(elm);
+                return elm;
+            },
+        };
+
+        Object.entries(constructorMethods).forEach(([name, makeElement]) => {
+            // TODO [#2972]: LWC components do not respect observedAttributes/attributeChangedCallback
+            it(`${name} - should not observe attributes`, () => {
+                const elm = makeElement();
+
+                elm.setAttribute('foo', 'bar');
+                elm.removeAttribute('foo');
+
+                expect(elm.changes).toEqual([]);
+            });
+        });
+    });
+}

packages/@lwc/integration-karma/test/component/observed-attributes/x/observes/observes.js

@@ -0,0 +1,11 @@
+import { LightningElement, api } from 'lwc';
+
+export default class extends LightningElement {
+    static observedAttributes = ['foo'];
+
+    @api changes = [];
+
+    attributeChangedCallback(name, oldValue, newValue) {
+        this.changes.push({ name, oldValue, newValue });
+    }
+}