onChange Client script does not provide "control" attribute in the Catalog Builder

[philiphelle]

Hello everyone,

I encountered somewhat unexpected behaiour that I wanted to share. Maybe someone else has the same experience. I noticed that creating a catalog item in the native platform via "maintain items" vs the catalog builder changes the client script argument "control". If a catalog item is created in via "maintain items", the control element in an onChange script contains the DOM node. If however the same catalog item is created in the catalog builder, the control argument is null.

Steps to reproduce in via "maintain items":

1. Navigate to All -> Service Catalog -> Catalog Definitions -> Maintain Items

2. Create a new catalog item with the UI Action "New"

3. In the related lists, create a new variable (single line text) with the name "Test 1"

4. In the related lists, create a new catalog client script of type onChange that depends on the question created in 3. (test_1):

function onChange(control, oldValue, newValue, isLoading) {
	console.log("control: ", control);
   if (isLoading || newValue == '') {
      return;
   }
}

5. Click UI Action "Try It"

6. Open Dev Tools (F12) and optionally clear the logs

7. Make a change in the field "Test 1" and unfocus (blur) the element.

-> this should trigger the onChange script and show a log in the console. Here we see that the control argument contains the DOM node as expected.

Output:

control:  
<input id="<redacted>" class="cat_item_option sc-content-pad form-control" name="<redacted>" value="" onchange="if (typeof(variableOnCha…<redacted>)" maxlength="" aria-labelledby="label_IO:<redacted>" aria-required="false">

Steps to reproduce in via Catalog Item Builder:

1. Navigate to All -> Service Catalog -> Catalog Builder

2. On the left in the card "Build catalog items from scratch" select the button "Build from Scratch"

3. Keep the selection "Standard" and click "Continue" (the catalog builder now opens the full walkthrough of the catalog item creation process)
4. Give it a name (f.e. "Test 2") and move on to "Questions"

5. Click "Insert new question" and create a simple Text question of subtype single-line (f.e. "Test 2"); insert it.

6. Move on to "Client Script" and create a new one of type onChange; select the question from 5. ("test_2) as dependency:

function onChange(control, oldValue, newValue, isLoading) {
	console.log("control: ", control);
   if (isLoading || newValue == '') {
      return;
   }
}

and click "add script".

7. Click on "Preview"

8. Open Dev Tools (F12) and optionally clear the log

9. Make a change in the field "Test 2" and unfocus blur) the element.

-> this should trigger the onChange script and show a log in the console. Here we see that the control argument is null.
Output: 

control:  null

Now, the argument 'control' being null limits our actions somewhat significantly, as we would have to get the values from a g_form.getValue("<field_name>") instead of using the more general control argument. It is also probably not wanted that this differs when we create the catalog item through the native portal vs creating it through the catalog builder.

Let me know if you do happen to find out more about it or if you encountered the same problem. I wasn't sure what category to put this in, I hope this will find people who think it is useful.

Cheers, Phil