chore: 🤖 Upgrade addons/rose dependencies (#1973)

* chore: 🤖 Upgrade addons/rose dependencies

Upgraded `addons/rose` dependencies to match other addons. Lint fixes,
and fixed scripts for concurrently

✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11587

* v4.4.1...v4.12.2

* Update ember-try.js

change scenarios to match 4.12.2

* Update addons/rose/tests/integration/components/rose/button-test.js

Co-authored-by: Lisbet Alvarez <107949262+lisbet-alvarez@users.noreply.github.com>

* Update ember-try.js

originally had the right scenarios for 4.
12.2

* chore: 🤖 upgrade ember-cli-babel

Upgrade ember-cli-babel to match other addons

✅ Closes: https://hashicorp.atlassian.net/browse/ICU-11587

* Update button-test.js

fix test declaration statement

---------

Co-authored-by: Lisbet Alvarez <107949262+lisbet-alvarez@users.noreply.github.com>

addons/rose/tests/dummy/config/ember-cli-update.json

@@ -3,7 +3,7 @@
   "packages": [
     {
       "name": "ember-cli",
-      "version": "4.4.1",
+      "version": "4.12.2",
       "blueprints": [
         {
           "name": "addon",

addons/rose/tests/dummy/config/ember-try.js

@@ -0,0 +1,58 @@
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: MPL-2.0
+ */
+
+'use strict';
+
+const getChannelURL = require('ember-source-channel-url');
+const { embroiderSafe, embroiderOptimized } = require('@embroider/test-setup');
+
+module.exports = async function () {
+  return {
+   scenarios: [
+      {
+        name: 'ember-lts-4.4',
+        npm: {
+          devDependencies: {
+            'ember-source': '~4.4.0',
+          },
+        },
+      },
+      {
+        name: 'ember-lts-4.8',
+        npm: {
+          devDependencies: {
+            'ember-source': '~4.8.0',
+          },
+        },
+      },
+      {
+        name: 'ember-release',
+        npm: {
+          devDependencies: {
+            'ember-source': await getChannelURL('release'),
+          },
+        },
+      },
+      {
+        name: 'ember-beta',
+        npm: {
+          devDependencies: {
+            'ember-source': await getChannelURL('beta'),
+          },
+        },
+      },
+      {
+        name: 'ember-canary',
+        npm: {
+          devDependencies: {
+            'ember-source': await getChannelURL('canary'),
+          },
+        },
+      },
+      embroiderSafe(),
+      embroiderOptimized(),
+    ],
+  };
+};

addons/rose/tests/dummy/config/environment.js

@@ -6,20 +6,17 @@
 'use strict';
 
 module.exports = function (environment) {
-  let ENV = {
+  const ENV = {
     modulePrefix: 'dummy',
     environment,
     rootURL: '/',
     locationType: 'auto',
     EmberENV: {
+      EXTEND_PROTOTYPES: false,
       FEATURES: {
         // Here you can enable experimental features on an ember canary build
         // e.g. EMBER_NATIVE_DECORATOR_SUPPORT: true
       },
-      EXTEND_PROTOTYPES: {
-        // Prevent Ember Data from overriding Date.parse.
-        Date: false,
-      },
     },
 
     APP: {

addons/rose/tests/integration/components/rose/anonymous-test.js

@@ -13,9 +13,9 @@ module('Integration | Component | rose/anonymous', function (hooks) {
 
   test('it renders', async function (assert) {
     await render(hbs`
-      {{#rose/anonymous tagName='main'}}
+      <Rose::Anonymous @tagName="main">
         template block text
-      {{/rose/anonymous}}
+      </Rose::Anonymous>
     `);
     assert.ok(find('main'));
     assert.strictEqual(this.element.textContent.trim(), 'template block text');

addons/rose/tests/integration/components/rose/button-test.js

@@ -21,8 +21,8 @@ module('Integration | Component | rose/button', function (hooks) {
     assert.strictEqual(find('button').type, 'button');
   });
 
-  test('it is type="submit" when @submit={{true}}', async function (assert) {
-    await render(hbs`<Rose::Button @submit={{true}} />`);
+  test('it is type="submit" when @onSubmit={{true}}', async function (assert) {
+    await render(hbs`<Rose::Button @onSubmit={{true}} />`);
     assert.strictEqual(find('button').type, 'submit');
   });
 
@@ -40,18 +40,18 @@ module('Integration | Component | rose/button', function (hooks) {
 
   test('it supports left and right icons', async function (assert) {
     await render(
-      hbs`<Rose::Button @iconLeft="flight-icons/svg/chevron-left-16" />`
+      hbs`<Rose::Button @iconLeft="flight-icons/svg/chevron-left-16" />`,
     );
     assert.ok(find('.has-icon-left .rose-icon'));
     await render(
-      hbs`<Rose::Button @iconRight="flight-icons/svg/chevron-left-16" />`
+      hbs`<Rose::Button @iconRight="flight-icons/svg/chevron-left-16" />`,
     );
     assert.ok(find('.has-icon-right .rose-icon'));
   });
 
   test('it supports an icon-only type', async function (assert) {
     await render(
-      hbs`<Rose::Button @iconOnly="flight-icons/svg/chevron-left-16" />`
+      hbs`<Rose::Button @iconOnly="flight-icons/svg/chevron-left-16" />`,
     );
     assert.ok(find('.has-icon-only .rose-icon'));
   });

addons/rose/tests/integration/components/rose/card/link-test.js

@@ -25,7 +25,7 @@ module('Integration | Component | rose/card/link', function (hooks) {
     assert.strictEqual(find('a').title, 'card title');
     assert.strictEqual(
       find('.rose-card-link-title').textContent.trim(),
-      'card title'
+      'card title',
     );
   });
 
@@ -33,7 +33,7 @@ module('Integration | Component | rose/card/link', function (hooks) {
     await render(hbs`<Rose::Card::Link @description="card description" />`);
     assert.strictEqual(
       find('.rose-card-link-body').textContent.trim(),
-      'card description'
+      'card description',
     );
   });
 
@@ -41,13 +41,13 @@ module('Integration | Component | rose/card/link', function (hooks) {
     await render(hbs`<Rose::Card::Link @id="card_id" />`);
     assert.strictEqual(
       find('.rose-card-link-footer-id').textContent.trim(),
-      'card_id'
+      'card_id',
     );
   });
 
   test('it renders with @icon', async function (assert) {
     await render(
-      hbs`<Rose::Card::Link @title="foo" @icon="flight-icons/svg/alert-circle-16" />`
+      hbs`<Rose::Card::Link @title="foo" @icon="flight-icons/svg/alert-circle-16" />`,
     );
     assert.ok(find('.rose-icon'));
   });
@@ -59,7 +59,7 @@ module('Integration | Component | rose/card/link', function (hooks) {
 
   test('it renders with content', async function (assert) {
     await render(hbs`<Rose::Card::Link>
-      <button/>
+      <button type="button" />
     </Rose::Card::Link>`);
     assert.ok(find('button'));
   });

addons/rose/tests/integration/components/rose/dropdown/button-test.js

@@ -21,8 +21,8 @@ module('Integration | Component | rose/dropdown/button', function (hooks) {
     assert.strictEqual(find('button').type, 'button');
   });
 
-  test('it is type="submit" when @submit={{true}}', async function (assert) {
-    await render(hbs`<Rose::Dropdown::Button @submit={{true}} />`);
+  test('it is type="submit" when @onSubmit={{true}}', async function (assert) {
+    await render(hbs`<Rose::Dropdown::Button @onSubmit={{true}} />`);
     assert.strictEqual(find('button').type, 'submit');
   });
 
@@ -38,7 +38,7 @@ module('Integration | Component | rose/dropdown/button', function (hooks) {
 
   test('it supports an icon-only type', async function (assert) {
     await render(
-      hbs`<Rose::Dropdown::Button @iconOnly="flight-icons/svg/chevron-left-16" />`
+      hbs`<Rose::Dropdown::Button @iconOnly="flight-icons/svg/chevron-left-16" />`,
     );
     assert.ok(find('.has-icon-only .rose-icon'));
   });

addons/rose/tests/integration/components/rose/form/actions-test.js

@@ -15,7 +15,13 @@ module('Integration | Component | rose/form/actions', function (hooks) {
     assert.expect(2);
     this.cancel = () => {};
     await render(
-      hbs`{{rose/form/actions cancel=this.cancel submitText='Save' cancelText='Cancel'}}`
+      hbs`
+        <Rose::Form::Actions
+          @cancel={{this.cancel}}
+          @submitText='Save'
+          @cancelText='Cancel'
+        />
+      `,
     );
     assert.ok(find('[type="submit"]'));
     assert.ok(find('button:not([type="submit"])'));
@@ -25,7 +31,15 @@ module('Integration | Component | rose/form/actions', function (hooks) {
     assert.expect(2);
     this.cancel = () => {};
     await render(
-      hbs`{{rose/form/actions cancel=this.cancel submitDisabled=true cancelDisabled=true submitText='Save' cancelText='Cancel'}}`
+      hbs`
+        <Rose::Form::Actions
+          @cancel={{this.cancel}}
+          @submitText='Save'
+          @cancelText='Cancel'
+          @submitDisabled={{true}}
+          @cancelDisabled={{true}}
+        />
+      `,
     );
     assert.ok(find('[type="submit"]:disabled'));
     assert.ok(find('button:not([type="submit"]):disabled'));
@@ -33,7 +47,9 @@ module('Integration | Component | rose/form/actions', function (hooks) {
 
   test('it optionally does not render the cancel button', async function (assert) {
     assert.expect(2);
-    await render(hbs`{{rose/form/actions submitText='Save' showCancel=false}}`);
+    await render(hbs`
+        <Rose::Form::Actions @submitText='Save' @showCancel={{false}} />
+    `);
     assert.ok(find('[type="submit"]'));
     assert.notOk(find('button:not([type="submit"])'));
   });
@@ -42,7 +58,13 @@ module('Integration | Component | rose/form/actions', function (hooks) {
     assert.expect(1);
     this.cancel = () => assert.ok(true, 'cancel was clicked');
     await render(
-      hbs`{{rose/form/actions cancel=this.cancel submitText='Save' cancelText='Cancel'}}`
+      hbs`
+        <Rose::Form::Actions
+          @cancel={{this.cancel}}
+          @submitText='Save'
+          @cancelText='Cancel'
+        />
+      `,
     );
     await click('button:not([type="submit"])');
   });

addons/rose/tests/integration/components/rose/form/actions/edit-toggle-test.js

@@ -17,7 +17,12 @@ module(
       assert.expect(1);
       this.enableEdit = () => {};
       await render(
-        hbs`{{rose/form/actions/edit-toggle enableEdit=this.enableEdit enableEditText='Edit'}}`
+        hbs`
+          <Rose::Form::Actions::EditToggle
+            @enableEdit={{this.enableEdit}}
+            @enableEditText='Edit'
+          />
+        `,
       );
       assert.ok(find('button'));
     });
@@ -26,9 +31,14 @@ module(
       assert.expect(1);
       this.enableEdit = () => assert.ok(true, 'edit was clicked');
       await render(
-        hbs`{{rose/form/actions/edit-toggle enableEdit=this.enableEdit enableEditText='Edit'}}`
+        hbs`
+          <Rose::Form::Actions::EditToggle
+            @enableEdit={{this.enableEdit}}
+            @enableEditText='Edit'
+          />
+        `,
       );
       await click('button');
     });
-  }
+  },
 );

addons/rose/tests/integration/components/rose/layout/body-content-test.js

@@ -26,7 +26,7 @@ module('Integration | Component | rose/layout/body-content', function (hooks) {
 
   test('it renders with content', async function (assert) {
     await render(hbs`<Rose::Layout::BodyContent as |bc|>
-      <bc.Body><button id="button" /></bc.Body>
+      <bc.Body><button id="button" type="button" /></bc.Body>
       <bc.Sidebar><p id="details">Resource Details</p></bc.Sidebar>
     </Rose::Layout::BodyContent>`);
 

addons/rose/tests/integration/components/rose/layout/page-test.js

@@ -24,7 +24,7 @@ module('Integration | Component | rose/layout/page', function (hooks) {
 
   test('it renders with content', async function (assert) {
     await render(hbs`<Rose::Layout::Page>
-      <button id="content" />
+      <button id="content" type="button" />
     </Rose::Layout::Page>`);
     assert.ok(find('#content'));
   });

addons/rose/tests/integration/components/rose/table/row-test.js

@@ -44,7 +44,7 @@ module('Integration | Component | rose/table/row', function (hooks) {
 
   test('it can be hidden', async function (assert) {
     assert.expect(1);
-    await render(hbs`<Rose::Table::Row @hidden=true />`);
+    await render(hbs`<Rose::Table::Row @hidden={{true}} />`);
     assert.ok(find('.rose-table-row-visually-hidden'));
   });
 });

addons/rose/tests/integration/components/rose/table/row/cell-test.js

@@ -50,7 +50,7 @@ module('Integration | Component | rose/table/row/cell', function (hooks) {
   test('it renders with align center in a header cell', async function (assert) {
     assert.expect(2);
     await render(
-      hbs`<Rose::Table::Row::Cell @tagName='th' @alignCenter=true />`
+      hbs`<Rose::Table::Row::Cell @tagName='th' @alignCenter={{true}} />`,
     );
     assert.ok(find('.rose-table-header-cell'));
     assert.ok(find('.align-center'));
@@ -58,7 +58,7 @@ module('Integration | Component | rose/table/row/cell', function (hooks) {
 
   test('it renders with align center in a body', async function (assert) {
     assert.expect(2);
-    await render(hbs`<Rose::Table::Row::Cell @alignCenter=true />`);
+    await render(hbs`<Rose::Table::Row::Cell @alignCenter={{true}} />`);
     assert.ok(find('.rose-table-cell'));
     assert.ok(find('.align-center'));
   });
@@ -66,7 +66,7 @@ module('Integration | Component | rose/table/row/cell', function (hooks) {
   test('it renders with align right in a header cell', async function (assert) {
     assert.expect(2);
     await render(
-      hbs`<Rose::Table::Row::Cell @tagName='th' @alignRight=true />`
+      hbs`<Rose::Table::Row::Cell @tagName='th' @alignRight={{true}} />`,
     );
     assert.ok(find('.rose-table-header-cell'));
     assert.ok(find('.align-right'));
@@ -74,7 +74,7 @@ module('Integration | Component | rose/table/row/cell', function (hooks) {
 
   test('it renders with align right', async function (assert) {
     assert.expect(2);
-    await render(hbs`<Rose::Table::Row::Cell @alignRight=true />`);
+    await render(hbs`<Rose::Table::Row::Cell @alignRight={{true}} />`);
     assert.ok(find('.rose-table-cell'));
     assert.ok(find('.align-right'));
   });

addons/rose/tests/integration/helpers/set-from-event-test.js

@@ -25,7 +25,7 @@ module('Integration | Helper | set-from-event', function (hooks) {
     assert.expect(2);
     this.set('inputValue', '1234');
     await render(
-      hbs`<button value="foobar" {{on 'click' (set-from-event this 'inputValue')}} />`
+      hbs`<button value="foobar" type="button" {{on 'click' (set-from-event this 'inputValue')}} />`,
     );
     assert.deepEqual(this.inputValue, '1234');
     await click('button');