This article contains information about how to capture data in Listvar through AEP WebSDK
Processing rules is the best bet as of now to get data in listvars by mapping context data with listvar. Adobe is in the process of simplifying the listVar schema and once it is done auto-mapping of for listvars would work.
Please note that while processing rules and listVars currently support a delimited list, in the future, that delimited list will need to be an array along with a delimiter you specify.
In short, it will follow the format currently used for listProps in the _experience.analytics field group. So if you are working and trying to future-proof the implementation, we would suggest to please capture the list value in both a delimited list as well as an array. If you do not want to do that than you will be able to use the XDM Mapper when it is released to convert that delimited list to an array.