**Plan: Wire paste-upload result into `dp-upload` component to prevent orphaned attachments** ### Changes Required 1. **`devplacepy/static/js/IssueReporter.js`** – In `_uploadImage()`, after a successful upload, locate the `dp-upload` element in the same `
` and push the returned `uid` into its internal `items` array, then call `syncUids()`, `renderChips()`, and `updateCount()`. 2. **`devplacepy/static/js/CommentManager.js`** – Apply the exact same change to its duplicated `_uploadImage()` method. 3. **`tests/e2e/issues/attachments.py`** – Add an end-to-end test that verifies the paste flow: simulate a paste event with a clipboard image, confirm the `attachment_uids` hidden input contains the returned uid, and confirm the `dp-upload` badge count increments to 1. ### Detailed Implementation #### Step 1 – Modify `IssueReporter.js` - Locate the `_uploadImage` method (around line 162 based on the existing implementation reference). - After `const result = await response.json();` and before the `insertAtCursor` call, insert: ```js const dpUpload = this.form.querySelector('dp-upload'); if (dpUpload) { dpUpload.items.push({ uid: result.uid, name: 'clipboard.png' }); dpUpload.syncUids(); dpUpload.renderChips(); dpUpload.updateCount(); } ``` #### Step 2 – Modify `CommentManager.js` - Locate the identical `_uploadImage` method (around line 240). - Insert the same code block after the successful API response. #### Step 3 – Add E2E test - In `tests/e2e/issues/attachments.py`, add a test `test_paste_image_into_description_and_check_uid`. - Steps: 1. Navigate to the new issue page. 2. Use `page.evaluate()` to trigger a `paste` event on the `textarea[name='description']` with a clipboard `DataTransfer` containing a valid PNG `File` object. 3. Wait for the upload to complete (observe the `dp-upload` component's badge text become "1" via `page.locator('dp-upload .badge')`). 4. Assert that the hidden input `input[name='attachment_uids']` has a non-empty value. 5. Optionally verify the textarea contains the expected markdown `![](...)`. ### Definition of Done - [ ] **Lint passes**: `pip install -q ruff && ruff check .` exits with code 0 (no new violations introduced). - [ ] **Unit tests pass**: `pip install -e '.[dev]' -q && make test-unit` succeeds. - [ ] **E2E test added** (`tests/e2e/issues/attachments.py`) passes and verifies: - The paste handler adds the uid to the `attachment_uids` hidden input. - The `dp-upload` badge count updates correctly. - [ ] **No orphaned attachments**: Any image pasted into the description is tracked via `dp-upload` and therefore linked to the issue on form submit. - [ ] **Manual verification** (optional but recommended): Start the dev server, navigate to a new issue form, paste a screenshot from clipboard, submit the issue, then verify the image appears both inline in the description and in the attachment gallery on the issue detail page.