Storybook: Custom head tag title not getting overwrited

[semoal]

Describe the bug
I need to change the storybook main html title on head tags.
First, I created a manager-head.html with <title> test </title>, didn't work. After that, I created a preview-head.html with the same content, same result...

To Reproduce
Steps to reproduce the behavior:

1. Create a storybook project
2. Add custom files for head tags
3. See how both titles are set on html, and just the first one is getting applied.

Expected behavior
Should delete, the standard title, because Chrome at least is not overwriting titles put after other one. Always it's getting the first one.

Screenshots

System:

• OS: [MacOS]
• Device: [ Macbook Pro 2018]
• Browser: [chrome with/without cache]
• Framework: [react]
• Version: [4.0.12]

[naipath]

I have come across this solution to be placed in the manager-head.html file:

<!-- Storybook override -->
<script>
  document.title = 'Carbon Components React';
</script>

This solution was found here: https://github.com/IBM/carbon-components-react/blob/master/.storybook/manager-head.html#L15

[semoal]

I have come across this solution to be placed in the manager-head.html file:

<!-- Storybook override -->
<script>
  document.title = 'Carbon Components React';
</script>

This solution was found here: https://github.com/IBM/carbon-components-react/blob/master/.storybook/manager-head.html#L15

Totally agree, nice solution.
It is so obvious that i didn't think about this.

Thank you mate.

[Brianzchen]

Hey there,

I tried the solution of using a script tag, but it doesn't seem to be working, it's loading with the title that I defined in the script but then it's immediately reverting back to Storybook. I imagine there must be some kind of JS code running somewhere that prevents it from staying as the title I define in the manager?

[ralberts]

@Brianzchen I ended up adding the following which seemed to work (not sure if it's the right thing to do or not but it seems to work):
<script> setTimeout(function() { document.title = 'Component Library'}, 1000); </script>