addEventListener 'change' Stopped Working - Photoshop 2022 Bug, Design or Me?

Hi All,

I’m on the tail-end of a hellish week updating my plugin after the release of Photoshop 2022, which broke it completely. First of all, I’d like to ask, where do some of you go to find out about releases and changes before Photoshop is actually released? Are you just signed up for beta releases and notice that your plugins break or is there a way to get more proactive information about upcoming changes?

My 2013 released scripts didn’t require an update for 8 years, and my UXP based plugin has broken completely twice now. Once with the 22.5 release and then again with the v23 release. I’d much prefer to be able to do this work proactively so that my plugin works when Photoshop gets updated. Any advice anyone has would be greatly appreciated.

Anyway, the first thing that broke, and was reported to me by a user of my plugin, was that all text (actually mostly numbers) edited throughout the plugin were not being passed by the event listener of textfields. The text was accepted by the field but not passed/stored by my plugin, and because I calculate other fields based on previous fields, after entering sizes into a few fields, null values and NaN errors started to crop up and the plugin nosedived.

I quickly found that the majority of places where I was using the ‘change’ event listener, it was not receiving the event/data from the field as the user tabbed or clicked away from it. I was not using the ‘input’ event for text input because I don’t need to act on 1, 14, 144, before getting the final intended value of 1440, as an example.

‘change’ worked perfectly for just giving me the final value, but it stopped working completely. My plugin now has around 50 text fields on multiple panels, so I’ve replaced the event with a variable called eventListener into which I store the event string, and this enables me to change it to whatever I want in one place now. I’ve started to use ‘blur’ so that I get the entered value after the user tabs or clicks away from the field.

Because I also refresh part of the UI to pickup calculated changes, I ended up implementing a diff() function that simply checks if the original stored value and new value from the field have changed, and I only act on the result passed from the ‘blur’ event if it’s different, so I’m really just emulating what ‘change’ would do in its absence.

So, my other question is, are other people not having problems with the ‘change’ event listener in Photoshop 2022 (v23)? I know it should work, but even something as simple as the below code will not work in my plugin after the update, while it would have worked fine until now.

  document.querySelector("#some-id-for-my-textfield").addEventListener('change', evt => {
    somewhereToStoreTheValue = evt.target.value;
    someFunctionToSaveChanges();
  });

The good news is that I was able to change some fields that I had to mark as ‘quiet’ when my plugin broke before (Text selected and lost of first space in textfield and textarea after PS 22.5 Update - #3 by MartinBailey) but that tells me that this functionality has been tweaked, so I’m also wondering if this is a new bug?

I’ll leave it there for this post. This change itself would have taken me a few hours, but I took this opportunity to also update to API 2, so the rest of the week was spent fixing things that broke with API 2.

This is a known issue in CC 2022. Adobe posted a work-around a few weeks back in the group. Here is the snippet for the workaround. Place this at the bottom of your JS file. Also, I recommend testing your plugins in the Photoshop beta releases, especially if you have plugins already released into the wild. That way you will find out about any issues before the Photoshop releases go public.

//workaround for sp-textfield change bug
(function () {
  if(require("uxp").versions.uxp.startsWith("uxp-5.5.1")) {
    let curField, curValue;
    document.addEventListener("focus", evt => {
      curField = evt.target;
      curValue = curField.value;
    }, true);
    document.addEventListener("blur", evt => {
      if (evt.target.tagName === "SP-TEXTFIELD") {
        if (curField === evt.target) {
          if (curValue !== evt.target.value) {
            const changeEvent = new Event("change", {
              bubbles: true
            });
            evt.target.dispatchEvent(changeEvent);
          }
        }
      }
    }, true);
  }
})();

Also, for the Photoshop beta releases, Adobe recently opened these up to everyone to test. The public beta releases don’t contain new features, which are only in the pre-release beta. However, the public beta releases should be the same for any UXP changes as the pre-release beta… at least I think that is the case.

Thanks for your replies Damon! I had searched for keywords that should have led to that post about these issues, so I don’t know why I wasn’t able to find that. It’s good to know that I have found and fixed all of the known issues mind.

I’ve also sent an email to get access to the Photoshop prerelease groups which it seems would help. I’ll hopefully be able to avoid a similar surprise the next time a big update is released.

Thanks again for your help! I really appreciate it.