OS Data Hub not working on iPad or iPhone - openlayers-6

Question

I look after a website which displays UK Ordnance Survey maps for people going on walks in SW England, and it relies on displaying a marker on an OS map, in response either to an alphanumeric OSGB grid reference, appended as a query string to the name of the HTML file which displays the map, or to a click on the OS map produced by the HTML file, in the absence of a query string. This has all worked well for several years, on both Windows PCs and mobile devices, using OS OpenSpace, which is based on OpenLayers 2, but now Ordnance Survey have decided to enforce a new system based on Open Layers 6, and requiring a complete re-code of the JavaScript. OS provide example code for various scenarios, from which I have re-written my code to run perfectly on a Windows PC with a mouse, but it fails on an iPad or an iPhone, particularly if the iPad is several years old.
Using a current Apple device, I cannot display a scaled vector graphic on an OS map, either at hard-coded co-ordinates, or in response to a tap on a map. A tap will however bring up a pop-up at the tapped point, and a swipe on the map will pan it. Using an iPad several years old, in addition to the above problems, opening two fingers will not zoom the map, and a swipe will not pan it. The only things that work are the + and - buttons on the map.
I have read that I may need to include a Controls section within my Map command, along the lines of:
controls: [
new OpenLayers.Control.TouchNavigation({
dragPanOptions: {
enableKinetic: true
}
}),
new OpenLayers.Control.Zoom()
],
but if I include this code, my JavaScript crashes, and the JavaScript Error Console within MS Edge gives error message 'OpenLayers is not defined'
Ordnance Survey tell me that my problem 'is an issue relating to the mapping library, OpenLayers, rather than our APIs' so my question is, how do I get code based on the OS examples to run on mobile devices of any age, in the same way my existing code based on Open Layers 2 has run for several years?
I will gladly supply a copy of my code which works on a Windows PC, but not on an Apple device, on request.

Answer 1

OpenLayers needs polyfills on older devices/browsers. Try adding
<script src="https://unpkg.com/elm-pep"></script>
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=fetch,requestAnimationFrame,Element.prototype.classList,URL"></script>
before the ol.js script. The default controls should be sufficient (the code you have used is Openlayers 2 format and will not work with OpenLayers 6).