auiSelect2() Edit loses focus on open

When using auiSelect2() on my local debug session (8.13.3) the select2 behaves as expected when opened in issue view inline edit. I can click on the CF edit the value using the select2 search of simply scroll and select the desired field.
When I upload this to my 8.13.3 DC instance however it behaves very odd. In issue edit mode it is fine.
However when on issue view and I click the CF to edit the value the field opens for edit however the select2 field fails to open up to display the search field and the available options. Instead it shows as a dark grey select field and when you press the up or down arrow or click the field again then it opens up as expected. However the edit ability on the line is lost as if you clicked away to terminate the edit. When you start typing in the search field it will move the search and options to the top left hand corner of the screen. I have been able to replicate in chrome and FF.

edit.vm


#controlHeader ($action $customField.id $customField.name $fieldLayoutItem.required $displayParameters.noHeader)
$webResourceManager.requireResource("com.atlassian.auiplugin:aui-select2")
<script>
	AJS.toInit(function (){
		AJS.$("#$customField.id").auiSelect2();
	});


</script>
<select
		id="$customField.id"
		name="$customField.id"
>
	
	#foreach($option in $optiondata)
		<option
					value="$option.getOptionId()"
		>
			$option.getValue()
		</option>
	#end
</select>

#controlFooter ($action $fieldLayoutItem.fieldDescription $displayParameters.noHeader)