Submit bookmark form with Ctrl/Cmd + Enter (#1158)

bookmarks/frontend/behaviors/form.js

@@ -1,5 +1,27 @@
 import { Behavior, registerBehavior } from "./index";
 
+class FormSubmit extends Behavior {
+  constructor(element) {
+    super(element);
+
+    this.onKeyDown = this.onKeyDown.bind(this);
+    this.element.addEventListener("keydown", this.onKeyDown);
+  }
+
+  destroy() {
+    this.element.removeEventListener("keydown", this.onKeyDown);
+  }
+
+  onKeyDown(event) {
+    // Check for Ctrl/Cmd + Enter combination
+    if (event.key === "Enter" && (event.metaKey || event.ctrlKey)) {
+      event.preventDefault();
+      event.stopPropagation();
+      this.element.requestSubmit();
+    }
+  }
+}
+
 class AutoSubmitBehavior extends Behavior {
   constructor(element) {
     super(element);
@@ -51,5 +73,6 @@ class UploadButton extends Behavior {
   }
 }
 
+registerBehavior("ld-form-submit", FormSubmit);
 registerBehavior("ld-auto-submit", AutoSubmitBehavior);
 registerBehavior("ld-upload-button", UploadButton);

bookmarks/templates/bookmarks/edit.html

@@ -13,7 +13,7 @@
         <h1 id="main-heading">Edit bookmark</h1>
       </div>
       <form action="{% url 'linkding:bookmarks.edit' bookmark_id %}?return_url={{ return_url|urlencode }}" method="post"
-            novalidate>
+            novalidate ld-form-submit>
         {% include 'bookmarks/form.html' %}
       </form>
     </main>

bookmarks/templates/bookmarks/new.html

@@ -12,7 +12,7 @@
       <div class="section-header">
         <h1 id="main-heading">New bookmark</h1>
       </div>
-      <form action="{% url 'linkding:bookmarks.new' %}" method="post" novalidate>
+      <form action="{% url 'linkding:bookmarks.new' %}" method="post" novalidate ld-form-submit>
         {% include 'bookmarks/form.html' %}
       </form>
     </main>

bookmarks/tests_e2e/e2e_test_new_bookmark_form.py

@@ -4,8 +4,9 @@ from urllib.parse import quote
 from django.urls import reverse
 from playwright.sync_api import sync_playwright, expect
 
-from bookmarks.tests_e2e.helpers import LinkdingE2ETestCase
+from bookmarks.models import Bookmark
 from bookmarks.services import website_loader
+from bookmarks.tests_e2e.helpers import LinkdingE2ETestCase
 
 mock_website_metadata = website_loader.WebsiteMetadata(
     url="https://example.com",
@@ -311,3 +312,26 @@ class BookmarkFormE2ETestCase(LinkdingE2ETestCase):
             # Verify that the fields are NOT visually marked as modified
             expect(title_field).to_have_class("form-input")
             expect(description_field).to_have_class("form-input")
+
+    def test_ctrl_enter_submits_form_from_description(self):
+        with sync_playwright() as p:
+            page = self.open(reverse("linkding:bookmarks.new"), p)
+            url_field = page.get_by_label("URL")
+            description_field = page.get_by_label("Description")
+
+            url_field.fill("https://example.com")
+            description_field.fill("Test description")
+            description_field.focus()
+
+            # Press Ctrl+Enter to submit form
+            description_field.press("Control+Enter")
+
+            # Should navigate away from new bookmark page after successful submission
+            expect(page).not_to_have_url(
+                self.live_server_url + reverse("linkding:bookmarks.new")
+            )
+
+        self.assertEqual(1, Bookmark.objects.count())
+        bookmark = Bookmark.objects.first()
+        self.assertEqual("https://example.com", bookmark.url)
+        self.assertEqual("Example Domain", bookmark.title)