From 7277f85358b8c26642729999cf00189e29092bc3 Mon Sep 17 00:00:00 2001
From: Michael Chadwick <michael.chadwick@gmail.com>
Date: Wed, 15 May 2024 13:40:55 -0700
Subject: [PATCH] created autofocus modifier and applied to message form

---
 app/components/new-message-input.hbs          |  2 +-
 app/modifiers/autofocus.js                    |  3 +++
 tests/integration/modifiers/autofocus-test.js | 15 +++++++++++++++
 3 files changed, 19 insertions(+), 1 deletion(-)
 create mode 100644 app/modifiers/autofocus.js
 create mode 100644 tests/integration/modifiers/autofocus-test.js

diff --git a/app/components/new-message-input.hbs b/app/components/new-message-input.hbs
index 53ce932..36d6f11 100644
--- a/app/components/new-message-input.hbs
+++ b/app/components/new-message-input.hbs
@@ -5,7 +5,7 @@
     @value={{this.message}}
     id="new-message-text"
     placeholder="Type message here and hit enter"
-    autofocus="autofocus"
+    {{autofocus}}
   />
   <button type="submit">
     Send
diff --git a/app/modifiers/autofocus.js b/app/modifiers/autofocus.js
new file mode 100644
index 0000000..6afc37d
--- /dev/null
+++ b/app/modifiers/autofocus.js
@@ -0,0 +1,3 @@
+import { modifier } from 'ember-modifier';
+
+export default modifier((element) => element.focus());
diff --git a/tests/integration/modifiers/autofocus-test.js b/tests/integration/modifiers/autofocus-test.js
new file mode 100644
index 0000000..c4a7bdc
--- /dev/null
+++ b/tests/integration/modifiers/autofocus-test.js
@@ -0,0 +1,15 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { render } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Integration | Modifier | autofocus', function (hooks) {
+  setupRenderingTest(hooks);
+
+  // Replace this with your real tests.
+  test('it renders', async function (assert) {
+    await render(hbs`<div {{autofocus}}></div>`);
+
+    assert.ok(true);
+  });
+});