diff --git a/libraries/ember/tests/cee-tests/basic-test.gjs b/libraries/ember/tests/cee-tests/basic-test.gjs
index f582fa4f45..56deb8f5df 100644
--- a/libraries/ember/tests/cee-tests/basic-test.gjs
+++ b/libraries/ember/tests/cee-tests/basic-test.gjs
@@ -1,6 +1,6 @@
import QUnit, { module, test } from "qunit";
import { setupRenderingTest } from "ember-qunit";
-import { render, find } from "@ember/test-helpers";
+import { click, settled, render, find } from "@ember/test-helpers";
import {
ComponentWithoutChildren,
@@ -24,14 +24,15 @@ module("basic support", function (hooks) {
);
- assert.dom('#wc').exists();
+ assert.dom('ce-without-children').exists();
});
});
module('with children', function () {
- function expectHasChildren() {
+ function expectHasChildren(wc) {
const { assert } = QUnit;
- let wc = find('#wc');
+
+ wc ||= find('#wc');
assert.dom(wc).exists();
@@ -46,5 +47,122 @@ module("basic support", function (hooks) {
assert.dom(paragraph).exists();
assert.strictEqual(paragraph.textContent, "Test p");
}
+
+ test("can display a Custom Element with children in a Shadow Root", async function(assert) {
+
+ await render(
+
+
+
+ );
+
+ let wc = find('ce-with-children');
+
+ assert.dom(wc).exists();
+
+ expectHasChildren(wc);
+ });
+
+
+ test("can display a Custom Element with children in a Shadow Root and pass in Light DOM children", async function(assert) {
+
+ await render(
+
+
+
+ );
+
+ let wc = find('ce-with-children');
+
+ assert.dom(wc).exists();
+
+ expectHasChildren(wc);
+
+ assert.dom(wc).hasText('2')
+ });
+
+
+ test("can display a Custom Element with children in the Shadow DOM and handle hiding and showing the element", async function(assert) {
+ let toggle;
+ const setToggle = (callback) => {
+ toggle = async () => {
+ callback();
+ // rendering is async
+ await settled();
+ };
+ };
+
+ await render(
+
+
+
+ );
+
+ expectHasChildren();
+ await toggle();
+
+ assert.dom('#dummy').exists();
+ assert.dom('#dummy').hasText('Dummy view');
+
+ await toggle();
+ expectHasChildren();
+ });
+ });
+
+ module('attributes and properties', function () {
+ test("will pass boolean data as either an attribute or a property", async function(assert) {
+ await render(
+
+
+
+ );
+
+ let wc = find('#wc');
+ // Is Passed as data
+ assert.dom(wc).doesNotHaveAttribute('bool');
+ assert.strictEqual(wc.bool, true);
+ });
+
+ test("will pass numeric data as either an attribute or a property", async function(assert) {
+ await render(
+
+
+
+ );
+
+ let wc = find('#wc');
+ // Is Passed as data
+ assert.dom(wc).doesNotHaveAttribute('num');
+ assert.strictEqual(parseInt(wc.num, 10), 42);
+ });
+
+ test("will pass string data as either an attribute or a property", async function(assert) {
+ await render(
+
+
+
+ );
+
+ let wc = find('#wc');
+ // Is Passed as data
+ assert.dom(wc).doesNotHaveAttribute('num');
+ assert.strictEqual(wc.str, 'Ember');
+ });
+ });
+
+ module('events', function () {
+ test("can imperatively listen to a DOM event dispatched by a Custom Element", async function(assert) {
+ await render(
+
+
+
+ );
+
+ assert.dom('#handled').hasText('false');
+
+ await click('#wc');
+
+ assert.dom('#handled').hasText('true');
+ });
});
});
From 3d753f6d8a5ee6fc4b8434aee3791e63b881155b Mon Sep 17 00:00:00 2001
From: NullVoxPopuli <199018+NullVoxPopuli@users.noreply.github.com>
Date: Mon, 30 Sep 2024 21:28:12 -0400
Subject: [PATCH 05/18] Advanced tests pass
---
.../ember/app/components/cee-scenarios.gjs | 2 +-
libraries/ember/package.json | 4 +-
libraries/ember/pnpm-lock.yaml | 6 +
.../ember/tests/cee-tests/advanced-test.gjs | 127 ++++++++++++++++++
.../ember/tests/cee-tests/basic-test.gjs | 6 -
libraries/ember/tests/test-helper.js | 2 +
6 files changed, 139 insertions(+), 8 deletions(-)
diff --git a/libraries/ember/app/components/cee-scenarios.gjs b/libraries/ember/app/components/cee-scenarios.gjs
index ef9673f0b7..cd6efa2a0d 100644
--- a/libraries/ember/app/components/cee-scenarios.gjs
+++ b/libraries/ember/app/components/cee-scenarios.gjs
@@ -118,7 +118,7 @@ export class ComponentWithImperativeEvent extends Component {
}
-export class ComponentWithDeclarativeEvent {
+export class ComponentWithDeclarativeEvent extends Component {
@tracked lowercaseHandled = false;
@tracked kebabHandled = false;
@tracked camelHandled = false;
diff --git a/libraries/ember/package.json b/libraries/ember/package.json
index b98d1ba620..05b6560816 100644
--- a/libraries/ember/package.json
+++ b/libraries/ember/package.json
@@ -22,6 +22,7 @@
"devDependencies": {
"@babel/core": "^7.25.2",
"@babel/eslint-parser": "^7.25.1",
+ "@babel/plugin-transform-runtime": "^7.25.4",
"@ember/optional-features": "^2.1.0",
"@ember/string": "^4.0.0",
"@ember/test-helpers": "^4.0.4",
@@ -108,6 +109,7 @@
}
},
"dependencies": {
- "ember-route-template": "^1.0.3"
+ "ember-route-template": "^1.0.3",
+ "qunit-theme-ember": "^1.0.0"
}
}
diff --git a/libraries/ember/pnpm-lock.yaml b/libraries/ember/pnpm-lock.yaml
index 14e55b8abd..5480a8f8f8 100644
--- a/libraries/ember/pnpm-lock.yaml
+++ b/libraries/ember/pnpm-lock.yaml
@@ -11,6 +11,9 @@ importers:
ember-route-template:
specifier: ^1.0.3
version: 1.0.3
+ qunit-theme-ember:
+ specifier: ^1.0.0
+ version: 1.0.0
devDependencies:
'@babel/core':
specifier: ^7.25.2
@@ -18,6 +21,9 @@ importers:
'@babel/eslint-parser':
specifier: ^7.25.1
version: 7.25.1(@babel/core@7.25.2)(eslint@9.11.1)
+ '@babel/plugin-transform-runtime':
+ specifier: ^7.25.4
+ version: 7.25.4(@babel/core@7.25.2)
'@ember/optional-features':
specifier: ^2.1.0
version: 2.1.0
diff --git a/libraries/ember/tests/cee-tests/advanced-test.gjs b/libraries/ember/tests/cee-tests/advanced-test.gjs
index e69de29bb2..9a7dd0f424 100644
--- a/libraries/ember/tests/cee-tests/advanced-test.gjs
+++ b/libraries/ember/tests/cee-tests/advanced-test.gjs
@@ -0,0 +1,127 @@
+import QUnit, { module, test } from "qunit";
+import { setupRenderingTest } from "ember-qunit";
+import { click, settled, render, find } from "@ember/test-helpers";
+
+import {
+ ComponentWithoutChildren,
+ ComponentWithChildren,
+ ComponentWithChildrenRerender,
+ ComponentWithDifferentViews,
+ ComponentWithProperties,
+ ComponentWithUnregistered,
+ ComponentWithImperativeEvent,
+ ComponentWithDeclarativeEvent,
+} from "ember-cee-app/components/cee-scenarios";
+
+module("advanced support", function (hooks) {
+ setupRenderingTest(hooks);
+
+ module("attributes and properties", function() {
+ test("will pass array data as a property", async function(assert) {
+ await render(
+
+
+
+ );
+
+ let wc = find('#wc');
+ assert.deepEqual(wc.arr, ['E', 'm', 'b', 'e', 'r']);
+ });
+
+ test("will pass object data as a property", async function(assert) {
+ await render(
+
+
+
+ );
+
+ let wc = find('#wc');
+ assert.deepEqual(wc.obj, { org: 'emberjs', repo: 'ember.js' });
+ });
+
+ test("will pass object data to a camelCase-named property", async function(assert) {
+ await render(
+
+
+
+ );
+
+ let wc = find('#wc');
+ assert.deepEqual(wc.camelCaseObj, { label: 'passed' });
+ });
+ });
+
+ module('events', function() {
+ test("can declaratively listen to a lowercase DOM event dispatched by a Custom Element", async function(assert) {
+ await render(
+
+
+
+ );
+
+ assert.dom('#wc').exists();
+ assert.dom('#lowercase').hasText('false');
+
+ await click('#wc');
+ assert.dom('#lowercase').hasText('true');
+ });
+
+
+ test("can declaratively listen to a kebab-case DOM event dispatched by a Custom Element", async function(assert) {
+ await render(
+
+
+
+ );
+
+ assert.dom('#wc').exists();
+ assert.dom('#kebab').hasText('false');
+
+ await click('#wc');
+ assert.dom('#kebab').hasText('true');
+ });
+
+
+ test("can declaratively listen to a camelCase DOM event dispatched by a Custom Element", async function(assert) {
+ await render(
+
+
+
+ );
+
+ assert.dom('#wc').exists();
+ assert.dom('#camel').hasText('false');
+
+ await click('#wc');
+ assert.dom('#camel').hasText('true');
+ });
+
+ test("can declaratively listen to a CAPScase DOM event dispatched by a Custom Element", async function(assert) {
+ await render(
+
+
+
+ );
+
+ assert.dom('#wc').exists();
+ assert.dom('#caps').hasText('false');
+
+ await click('#wc');
+ assert.dom('#caps').hasText('true');
+ });
+
+ test("can declaratively listen to a PascalCase DOM event dispatched by a Custom Element", async function(assert) {
+ await render(
+
+
+
+ );
+
+ assert.dom('#wc').exists();
+ assert.dom('#pascal').hasText('false');
+
+ await click('#wc');
+ assert.dom('#pascal').hasText('true');
+ });
+ });
+});
diff --git a/libraries/ember/tests/cee-tests/basic-test.gjs b/libraries/ember/tests/cee-tests/basic-test.gjs
index 56deb8f5df..789cfe3bd9 100644
--- a/libraries/ember/tests/cee-tests/basic-test.gjs
+++ b/libraries/ember/tests/cee-tests/basic-test.gjs
@@ -118,8 +118,6 @@ module("basic support", function (hooks) {
);
let wc = find('#wc');
- // Is Passed as data
- assert.dom(wc).doesNotHaveAttribute('bool');
assert.strictEqual(wc.bool, true);
});
@@ -131,8 +129,6 @@ module("basic support", function (hooks) {
);
let wc = find('#wc');
- // Is Passed as data
- assert.dom(wc).doesNotHaveAttribute('num');
assert.strictEqual(parseInt(wc.num, 10), 42);
});
@@ -144,8 +140,6 @@ module("basic support", function (hooks) {
);
let wc = find('#wc');
- // Is Passed as data
- assert.dom(wc).doesNotHaveAttribute('num');
assert.strictEqual(wc.str, 'Ember');
});
});
diff --git a/libraries/ember/tests/test-helper.js b/libraries/ember/tests/test-helper.js
index faa35b5513..a393e5eca9 100644
--- a/libraries/ember/tests/test-helper.js
+++ b/libraries/ember/tests/test-helper.js
@@ -1,3 +1,5 @@
+import "qunit-theme-ember/qunit.css";
+
import Application from "ember-cee-app/app";
import config from "ember-cee-app/config/environment";
import * as QUnit from "qunit";
From 54c8b18a097cdeb6828b65e0ac4827713d942c38 Mon Sep 17 00:00:00 2001
From: NullVoxPopuli <199018+NullVoxPopuli@users.noreply.github.com>
Date: Mon, 30 Sep 2024 21:36:29 -0400
Subject: [PATCH 06/18] Add meta
---
libraries/ember/meta/expectedResults.json | 19 +++++++++++++++++++
libraries/ember/meta/issues.json | 1 +
libraries/ember/meta/summary.md | 9 +++++++++
package.json | 1 +
4 files changed, 30 insertions(+)
create mode 100644 libraries/ember/meta/expectedResults.json
create mode 100644 libraries/ember/meta/issues.json
create mode 100644 libraries/ember/meta/summary.md
diff --git a/libraries/ember/meta/expectedResults.json b/libraries/ember/meta/expectedResults.json
new file mode 100644
index 0000000000..714176a640
--- /dev/null
+++ b/libraries/ember/meta/expectedResults.json
@@ -0,0 +1,19 @@
+{
+ "success": 32,
+ "failed": 0,
+ "skipped": 0,
+ "error": false,
+ "disconnected": false,
+ "exitCode": 0,
+ "score": 100,
+ "basicSupport": {
+ "total": 16,
+ "failed": 0,
+ "passed": 16
+ },
+ "advancedSupport": {
+ "total": 16,
+ "failed": 0,
+ "passed": 16
+ }
+}
diff --git a/libraries/ember/meta/issues.json b/libraries/ember/meta/issues.json
new file mode 100644
index 0000000000..fe51488c70
--- /dev/null
+++ b/libraries/ember/meta/issues.json
@@ -0,0 +1 @@
+[]
diff --git a/libraries/ember/meta/summary.md b/libraries/ember/meta/summary.md
new file mode 100644
index 0000000000..0e30dee7eb
--- /dev/null
+++ b/libraries/ember/meta/summary.md
@@ -0,0 +1,9 @@
+
Handling data
+
+Because attributes must be strings, Ember requires that, if an attribute is desired,
+its value be a string, otherwise data is passed as properties to the element instance.
+
+