What you were expecting:
Previous to Beta, Cloning a resource with an Array property would succeed.
What happened instead:
A browser runtime error is encountered:
TypeError: (input.value || []).map is not a function
The error was occurring at ~179 of AutocompleteArrayInput.js
var selectedItems = useMemo(function () {
**return (input.value || []).map(getSuggestionFromValue);**
}, [input.value, getSuggestionFromValue]);
Steps to reproduce:
Using any resource with an array attribute/property, clone a record of that resource.
NOTE: The property must contain at least 1 value in the array as an empty-null array is successfully and results in a false negative test. Only resources with 1 or more elements in the array result in the error.
You can see by the example URL below that the array property is serialized in the 'none' (default) format of the stringify method of query-string for the attribute 'tags':
http://localhost:3006/#/sources/create?class_id=2&label=Mercy%20ORU%20Feeds&name=MERCYORU¬es&status_enum=enabled&tags=12&tags=21
insert short code snippets here
I believe that an easy fix to this issue is simply to change line 46 of CloneButton.js to this:
search: stringify(omitId(record), {arrayFormat: 'bracket'})
This will result in the stringify matching the corresponding parse in the useCreateController.ts which does the following to the URL:
? parse(search, { arrayFormat: 'bracket' })
Environment
Changing the arrayFormat will fix the bug for the tags case but if you look the same problem occurs with the Backlinks input in the simple demo. The query-string doesn't support deep nesting. @fzaninotto @djhi Why don't we change to JSON.stringify here?
+1 for comments about deeper problems. I 100% agree. I'm open here if someone wants to try something and I will regression test.
FWIW, I've cloned the CloneButton tag in the meantime and fixed the issue in my own hacky way for the short term. I was going to do a pull request, but I think this is deeper and you folks will find a cleaner way. One thing I have added to my CloneButton is an optional Callback func parameter so that the application logic can optionally 'tweak' the Record just before it is serialized for the Clone.
I added this callback to allow for certain fields to be cleared that should not be cloned and others modified that must be unique. Case in point: For my "Name" field, I append "_copy(n)" to the name so that it is unique.
Thanks, I reproduced the bug.
Fixed by #3973
Most helpful comment
Changing the
arrayFormatwill fix the bug for the tags case but if you look the same problem occurs with the Backlinks input in the simple demo. The query-string doesn't support deep nesting. @fzaninotto @djhi Why don't we change toJSON.stringifyhere?