I have working widget from Atlassian, when I use it in html file, behaviour is as expected:
<html lang="en">
<head>
<script data-jsd-embedded data-key=<key> data-base-url=https://jsd-widget.atlassian.com src=https://jsd-widget.atlassian.com/assets/embed.js></script>
</head>
</html>
but when I use it directly in vue component then I can't see widget:
<template>
<p>test</p>
</template>
<script setup>
import { onMounted } from 'vue';
onMounted(() => {
const script = document.createElement('script');
script.setAttribute('data-jsd-embedded', '');
script.setAttribute('data-key', '<key>');
script.setAttribute('data-base-url', 'https://jsd-widget.atlassian.com');
script.setAttribute('src', 'https://jsd-widget.atlassian.com/assets/embed.js');
document.head.appendChild(script);
});
</script>
I have tested different approaches but without result, no errors/warnings in console log.
Script imports are usually done in a static part of an application in a header of index.html.