Add disconnectedCallback to prevent duplicate inputs on DOM reconnection

[Copilot]

The connectedCallback method created new hidden inputs and event listeners on every invocation. When custom elements are removed and re-added to the DOM, this caused duplicate inputs and memory leaks.

Changes

• Guard against re-initialization: Early return in connectedCallback if _fileInput already exists
• Implement disconnectedCallback: Remove event listeners, clean up DOM, and null the _fileInput reference
• Store bound handler references: Replace inline arrow functions with stored references (_changeHandler, _boundFormDataHandler, _boundSubmitHandler, _boundUploadHandler) to enable proper cleanup
• Update changeHandler: Use stored reference when replacing submit handler

Example

// Before: Multiple calls created duplicate inputs
const input = new S3FileInput()
form.appendChild(input)  // Creates input + listeners
form.removeChild(input)
form.appendChild(input)  // Creates ANOTHER input + listeners ❌

// After: Proper lifecycle management
form.appendChild(input)  // Creates input + listeners
form.removeChild(input)  // Cleans up via disconnectedCallback
form.appendChild(input)  // Reuses existing input or creates new one cleanly ✅

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 98.20%. Comparing base (2218cd3) to head (a0ce128).
⚠️ Report is 2 commits behind head on safari.

Additional details and impacted files

@@           Coverage Diff           @@
##           safari     #358   +/-   ##
=======================================
  Coverage   98.20%   98.20%           
=======================================
  Files           8        8           
  Lines         223      223           
=======================================
  Hits          219      219           
  Misses          4        4           

Flag	Coverage Δ
python	98.20% <ø> (ø)
selenium-ubuntu-latest	82.51% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[codingjoe]

LGTM

[Copilot]

Pull request overview

This PR implements proper lifecycle management for the S3FileInput custom element to prevent duplicate hidden inputs and memory leaks when the element is removed and re-added to the DOM.

Key Changes:

• Added guard in connectedCallback to prevent re-initialization if already connected
• Implemented disconnectedCallback to clean up event listeners and DOM elements
• Refactored event handlers to use stored bound references for proper cleanup

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.

File	Description
s3file/static/s3file/js/s3file.js	Added lifecycle management with disconnectedCallback, guard logic in connectedCallback, and stored bound handler references for cleanup
tests/tests/s3file.test.js	Added tests for disconnectedCallback cleanup and prevention of duplicate inputs on reconnection

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The bound handler references (_changeHandler, _boundFormDataHandler, _boundSubmitHandler, _boundUploadHandler) should be nulled after removing event listeners to prevent memory leaks. These references will persist in memory even after the element is disconnected and the event listeners are removed.

Consider adding the following after line 81:

• Set this._changeHandler = null
• Set this._boundFormDataHandler = null
• Set this._boundSubmitHandler = null
• Set this._boundUploadHandler = null