orchidsoftware / orchidsoftware/platform

In Listener, old listener_controller event is still being triggered on target field change

Open
#2,794 0 comments 0 reactions 1 assignee View on GitHub

@tabuna is already working on this.

Since Jan 23, 2024.

Errors
Dominant language
PHP
Stars
4.8k
Forks
663
Avg merge
1d 9h
Merged PRs (30d)
7

Description

Describe the bug
When using Listener with target field and then changing the target field more than once will trigger the old controller instance's asyncLoadData function. This causes the browser to throw an error FormData constructor: Argument 1 is not an object. since the controller's element is already detached.

To Reproduce
Steps to reproduce the behavior:

  1. Create a Screen with a single checkbox
  2. Create a Listener that targets the checkbox
  3. Check/uncheck the checkbox more than once

Expected behavior
No client side error occurred.

Desktop (please complete the following information):

  • OS: Windows 11
  • Browser Firefox
  • Version 121.0.1

Server (please complete the following information):

  • Platfrom Version: 14
  • Laravel Version: 10
  • PHP Version: 8.2
  • Database: MariaDB
  • Database Version: 10

Additional context
Seems like the problem's caused by stale event handler pointing to the asyncLoadData. I tried removing the event handler on disconnect to solve it through my own custom controller like follows.

    eventHandles = {};
    connect() {
        this.targets.forEach(name => {
            document.querySelectorAll(`[name="${name}"]`)
                .forEach((field) => {
                    this.eventHandles[field] = () => this.asyncLoadData();
                    field.addEventListener('change',  this.eventHandles[field])
                });
        });
    }
    disconnect() {
        this.targets.forEach(name => {
            document.querySelectorAll(`[name="${name}"]`)
                .forEach((field) =>
                    field.removeEventListener('change', this.eventHandles[field])
                );
        });
    }

Not sure if this is the preferred approach though. If so, I can submit a pull request.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.