5446 add system test

Author: janeewheatley

app/javascript/utils/audit_duplicates.js

@@ -1,50 +1,61 @@
 import $ from 'jquery';
 
 $(() => {
-  function checkForDuplicates(e, buttonName) {
-    const form = $(this).closest('form');
-    const itemCounts = {}; // Will look like: { "2": 3, "5": 1, "12": 2 }
-    const itemNames = {}; // Will look like: { "2": "Item A", "5": "Item B", "12": "Item C" }
-    const itemQuantities = {}; // Will look like: { "2": [{qty: 15, barcode: "123"}, {qty: 10, barcode: "456"}] }
+  function processFormItems(form) {
+    const itemCounts = {};
+    const itemNames = {};
+    const itemQuantities = {};
+    const itemSections = [];
 
-    form.find('select[name$="[item_id]"]').each(function() {
+    form.find('select[name*="[item_id]"]').each(function() {
       const itemId = $(this).val();
       const itemText = $(this).find('option:selected').text();
       const section = $(this).closest('.line_item_section');
       const quantityInput = section.find('input[name*="[quantity]"]');
       const itemQuantity = parseInt(quantityInput.val()) || 0;
       const barcodeValue = section.find('.__barcode_item_lookup').val() || '';
 
-      if (!itemId || itemText === "Choose an item" || itemQuantity === 0) {
-        section.remove();
+      if (!itemId || itemId === '' || itemText === "Choose an item" || itemQuantity === 0) {
         return;
       }
 
       itemCounts[itemId] = (itemCounts[itemId] || 0) + 1;
       itemNames[itemId] = itemText;
       if (!itemQuantities[itemId]) itemQuantities[itemId] = [];
       itemQuantities[itemId].push({ qty: itemQuantity, barcode: barcodeValue });
+      itemSections.push({ itemId, section, quantity: itemQuantity });
     });
+
+    return { itemCounts, itemNames, itemQuantities, itemSections };
+  }
+
+  function checkForDuplicates(e, buttonName) {
+    e.preventDefault(); // Always prevent default first
+    
+    const form = $(this).closest('form');
+    const { itemCounts, itemNames, itemQuantities } = processFormItems(form);
 
     // Check for duplicates
     const duplicates = Object.keys(itemCounts)
-      .filter(itemId => itemCounts[itemId] > 1)
+      .filter(itemId => itemId && itemId !== '' && itemCounts[itemId] > 1)
       .map(itemId => ({ name: itemNames[itemId], id: itemId }));
 
     if (duplicates.length > 0) {
       // Show modal with duplicate items
       showDuplicateModal(duplicates, itemQuantities, form, buttonName);
-      e.preventDefault();
-    } 
-    // else, allow form submission to proceed
+      return false;
+    } else {
+      // No duplicates, submit the form
+      const hiddenBtn = $(`<button type="submit" name="${buttonName}" style="display:none;"></button>`);
+      form.append(hiddenBtn);
+      form.off('submit'); // Remove event handlers to avoid recursion
+      hiddenBtn.trigger('click');
+    }
   }
 
-  $("button[name='save_progress']").on('click', function (e) {
-    checkForDuplicates.call(this, e, 'save_progress');
-  });
-
-  $("button[name='confirm_audit']").on('click', function (e) {
-    checkForDuplicates.call(this, e, 'confirm_audit');
+  $(document).on('click', "button[name='save_progress'], button[name='confirm_audit']", function (e) {
+    const buttonName = $(this).attr('name');
+    checkForDuplicates.call(this, e, buttonName);
   });
 
   function showDuplicateModal(duplicateItems, duplicateQuantities, form, buttonName) {
@@ -85,9 +96,6 @@ $(() => {
       </div>
     `;
 
-    // Remove existing modal
-    $('#duplicateItemsModal').remove();
-    
     // Add and show modal
     $('body').append(modalHtml);
     $('#duplicateItemsModal').modal('show');
@@ -108,39 +116,31 @@ $(() => {
       const hiddenBtn = $(`<button type="submit" name="${buttonName}" style="display:none;"></button>`);
       form.append(hiddenBtn);
 
-      // Click the hidden button to submit with the correct parameter
+      // // Click the hidden button to submit with the correct parameter
       hiddenBtn.trigger('click');
     });
   }
 
   function mergeDuplicateItems(form) {
-    const itemQuantities = {};
-    const itemSections = [];
+    const { itemSections } = processFormItems(form);
+    const mergedQuantities = {};
 
-    // Collect all line items and their quantities
-    form.find('select[name$="[item_id]"]').each(function() {
-      const itemId = $(this).val();
-      const section = $(this).closest('.line_item_section');
-      const quantityInput = section.find('input[name*="[quantity]"]');
-      const quantity = parseInt(quantityInput.val()) || 0;
-      
-      if (itemId && itemId !== '') {
-        itemSections.push({ itemId, section, quantity });
-        itemQuantities[itemId] = (itemQuantities[itemId] || 0) + quantity;
-      }
+    // Calculate merged quantities
+    itemSections.forEach(({ itemId, quantity }) => {
+      mergedQuantities[itemId] = (mergedQuantities[itemId] || 0) + quantity;
     });
 
     // Find duplicates and merge them
     const processedItems = new Set();
 
-    itemSections.forEach(({ itemId, section, quantity }) => {
+    itemSections.forEach(({ itemId, section }) => {
       if (processedItems.has(itemId)) {
         // This is a duplicate - remove it
         section.remove();
       } else {
         // This is the first occurrence - update quantity to merged total
         const quantityInput = section.find('input[name*="[quantity]"]');
-        quantityInput.val(itemQuantities[itemId]);
+        quantityInput.val(mergedQuantities[itemId]);
         processedItems.add(itemId);
       }
     });

spec/system/audit_system_spec.rb

@@ -195,6 +195,51 @@
         expect(page).to have_content("Delete Audit")
         expect(page).to have_content("Finalize Audit")
       end
+
+      it "detects duplicate items and shows modal", js: true do
+        # Disable server-side validation to test JS modal
+        allow_any_instance_of(Audit).to receive(:line_items_unique_by_item_id)
+        visit subject
+        click_link "New Audit"
+
+        await_select2("#audit_line_items_attributes_0_item_id") do
+          select storage_location.name, from: "Storage location"
+        end
+
+        # Add first entry for the item
+        select item.name, from: "audit_line_items_attributes_0_item_id"
+        fill_in "audit_line_items_attributes_0_quantity", with: "10"
+
+        # Add a new line item row
+        find("[data-form-input-target='addButton']").click
+
+        # Add second entry for the same item
+        within all('.line_item_section').last do
+          item_select = find('select[name*="[item_id]"]')
+          select item.name, from: item_select[:id]
+          quantity_input = find('input[name*="[quantity]"]')
+          fill_in quantity_input[:id], with: "15"
+        end
+
+        # Try to save - should trigger duplicate detection modal
+        click_button "Save Progress"
+
+        # JavaScript modal should appear
+        expect(page).to have_css("#duplicateItemsModal", visible: true)
+        expect(page).to have_content("Multiple Item Entries Detected")
+        expect(page).to have_content("Merge Items")
+        expect(page).to have_content("Make Changes")
+
+        # Test merge functionality
+        click_button "Merge Items"
+
+        # Should merge duplicates and submit successfully
+        expect(page).to have_content("Audit's progress was successfully saved.")
+
+        # Verify only one line item with merged quantity (10 + 15 = 25)
+        expect(Audit.last.line_items.count).to eq(1)
+        expect(Audit.last.line_items.first.quantity).to eq(25)
+      end
     end
 
     context "with an existing audit" do