Try setting the cursor style directly in your CSS body{}. Then if that doesn’t work, use the full URL.
If you get it working in the CSS the problem is not the link but dynamically setting the cursor.
The request for the SVG file will take a minimum 500ms to fetch and parse. In that time the browser will default back to the pointer because you are using the mouse and it needs an icon immediately.
Usually CSS is parsed before HTML and DOMContentLoaded.
Why do you need to change the icon on click?
Another way might be to add a class to the body on the click event that changes the cursor style.
Then maybe setTimeout and remove the class.
That way the SVG has already been loaded before the click event. e.g.
window.addEventListener(‘click’ () => document.querySelector(‘body’).classList.add(‘clicked’))
window.addEventListener(‘click’ () =>
setTimeout(()=>document.querySelector(‘body’).classList.remove(‘clicked’), 500))
.clicked{ cursor: url(’…/img/point.svg’), }
Good Luck