Hi @stephenmok, @DanielDelCore! We’re still not seeing the correct behavior on our instances, any news about the deployment of the fixes?
Since we’re on the subject: I realize that this is still beta code and stuff can break. But it is extremely important that it should break only for users that have enabled theming in their lab features! If we can’t trust the code will not affect the clients who don’t enable (or know about) theming, then we can’t deploy the code to production at all, so nobody can beta test our app theming even if they want to.
The part of the code that checks the lab feature and does absolutely nothing if it’s disabled needs to be rock-solid.
1 Like
There is no window.AP.theming method, it comes as undefined. Please help
Hey @bbutnaru @GauriYadav 
Could you both confirm that you have been enrolled into the program? If so, could you share your company name so I can reach out via email? Or feel free to reply directly to your enrollment confirmation email and I’ll jump in.
There is no window.AP.theming method, it comes as undefined.
Currently, this method is only available in enabled development instances and will be undefined in production until we lift our feature flag, so please be sure to null-check before using the method in prod.
We’re still not seeing the correct behaviour on our instances, any news about the deployment of the fixes?
We’re currently working through the bugs raised by @LeonRothYasoon and others as a top priority, aiming to publish them within a week or so given no other blockers are found.
But it is extremely important that it should break only for users that have enabled theming in their lab features!
Agreed, it’s absolutely essential that all users (labs or otherwise) have completely functional experiences, we’ll treat any production issues as official incidents. Your emphasis on stability is completely justified which is why we are intentionally moving slowly but surely to ensure we get it right before we go to prod 
Cheers,
Dan.
1 Like
Hey @DanielDelCore
not sure if this is intended, but the --ds-surface token always returns a static color. Given that you can open issues in the modal (e.g. from boards) where the issue background is lighter, our apps using --ds-surface now appear too dark:
Is this intended meaning we should apply a different background token ourselves when opened in the modal?
Hi partners,
In the future — we’ll let you know the date:
- You’ll only need to call
window.AP.theming.initializeTheming()
- Themes will be visible on all instances
The future I mentioned above is just about here!
Progressively during next week, beginning Mon 27 Mar 2023, we will be enabling theming of Marketplace apps built with Connect across all customer instances of Jira Cloud. (Support for apps built with Forge will follow soon, and I’ll let you know that date once confirmed.)
From that point, any Marketplace partner will be able to start developing with design tokens and theming immediately — no need to fill in the form to enrol in early access. Go go go! 
Customers will see Marketplace apps themed if both of these are true:
- They have turned on light/dark themes in Jira labs in their personal settings; and
- Your Connect app calls
window.AP.theming.initializeTheming()
This means you should take care to not ship to customers in production until you’re ready any version of your app that calls initializeTheming(). Otherwise, customers will see the partially-themed app you’re working still on.
We’ll update what we’re communicating to customers so they know the first themed Marketplace apps will start to show up, but the message will continue to be that it’s a work in progress and you’re all working hard on getting your apps ready!
Separately, a heads-up that we’re acting on feedback from both customers and partners and are making tweaks to improve the colours used in both light and dark themes, so expect to see more of that in the coming weeks.
As always, please reply and let me & the team know with your questions!
Cheers,
Stephen
2 Likes
Thanks for the update, Stephen! Our app is mostly ready, the only thing that’s keeping us from deploying the code to production is uncertainty about how it will interact with the initializeTheming part. One issue with the progressive deployment of new features is that it’s hard to be sure that what we’re seeing during tests is the same thing customers see.
Is there some way of ensuring that some of our test instances are always in the first deployment cohort (so we can test the feature in advance) and that other instances are always in the last deployment cohort (so we can investigate if a customer who did not get the feature yet has issues), for this particular deployment?
(We have both some EAP instances and a premium instance on the “bundled” release track, which are supposed to be that. But we have very little visibility in what is deployed where and when, and we’ve seen changes bypass both. So in practice we need to be extremely conservative with releases, for fear a customer will get behavior that we can’t reproduce.)
Appreciate the question @bbutnaru, and very exciting to hear that your app is mostly ready! 
If I understand you correctly, you want to be able to see what’s coming soon (via early access on dev/test instances), but also what customers see (in a different test instance), even in the middle of a roll-out?
For the first part, all of your test instances that you’ve enrolled as part of early access for tokens/theming specifically (by filling in the form) will be where you can test in advance for sure. For the second part, I’ll check with the relevant teams about the details and get back to you.
Cheers,
Stephen
Yes @stephenmok. To be clear, in the middle of a rollout we can get a support request from a customer before the new feature has been rolled out on their instance, but after it was rolled out to all of our test instances. In that case, we can no longer reproduce the customer’s setup to debug their issue.
Hi @stephenmok,
We’re glad the themes will start to be enabled on customer instances next week, this is great news. Is it possible for us to know when the rollout is expected to be completed on all customer instances? Is this expected to be completed by the end of the next week or does the progressive rollout generally take longer?
Best regards,
Dan
Hey @dmihalache & @bbutnaru
Is it possible for us to know when the rollout is expected to be completed on all customer instances?
Our roll-out will commence today and we expect to be complete by tomorrow 5 pm (AEDT). We’ll keep this thread posted with updates if anything changes.
For clarity we’ve chosen a more speedy release strategy, given we’re also behind the Dark Mode Jira Labs toggle, which progresses as follows:
Immediately 10% => after 3 hours 50% => after 24 hours 100%.
in the middle of a rollout we can get a support request from a customer before the new feature has been rolled out on their instance, but after it was rolled out to all of our test instances. In that case, we can no longer reproduce the customer’s setup to debug their issue.
@bbutnaru in this case, you can let me know if there are instances you would like me to temporarily disable so you can test your app.
1 Like
Hey all,
Can now confirm that our Connect + Tokens integration is now at 100% availability in production 
Please let me know if you spot any issues.
Cheers,
Daniel!
1 Like
Hey Daniel,
we released a new version of our integration and it looks great !
We have just seen sometimes a quick white background before loading the CSS theme, I think due the CSS styles loaded dynamically by the call to initializeTheming().
Do you think a possible solution could be allowing the iframe to be transparent on your part or can break some compatibility ?
3 Likes
@DanielDelCore Still seeing this happen, the issue modal surface is lighter than the standard surface, please check the screenshot.
Is this intended? Should we apply a different surface token when in the issue modal?
1 Like
Hey @LeonRothYasoon, this is a known issue that we’ll provide some sort of API for to get this resolved. We’ll come back to you with a solution shortly.
@AndreaSerra, this can happen depending on where the initializeTheming() method is called.
We recommend calling this in a blocking script tag to avoid the flash:
<HTML data-theme="dark" data-color-mode="dark">
<head>
</head>
<body>
<script>
window.AP.theming.initializeTheming();
</script>
</body>
</HTML>
Can you share any of your implementation details with us so we can troubleshoot?
1 Like
We call the initializeTheming() method as soon the https://connect-cdn.atl-paas.net/all.js gets loaded by our client library placed in the <head>.
But I’ve also tried to remove all our code and leave only the AP library in the header and the initializeTheming() in the body with the same result: sometimes it flickers.
#balsamiq-panel-body {
background: var(--ds-surface-overlay,#ffffff);
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<script src="https://connect-cdn.atl-paas.net/all.js"></script>
</head>
<body id="balsamiq-panel-body">
<script>
window.AP.theming.initializeTheming();
</script>
</body>
</html>
1 Like
Not an Atlassian, but you’ll want to move it up.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<script src="https://connect-cdn.atl-paas.net/all.js"></script>
<script>
window.AP.theming.initializeTheming();
</script>
</head>
<body id="balsamiq-panel-body">
</body>
</html>
That way the FOUC is minimized. In this one case you’ll probably want to go against every web frontend performance guidance and have that even before css etc.
We will still have to deal with that the all.js is loaded on a cdn - so you can still get some “fun” issues there but at least moving the call out of the body makes the browser not render the body…
1 Like
Sigh,… @AndreasSerra unfortunately - I must say that I was wrong - at least if you’re using an Issue Activity Panel.
We’re doing the above there and getting the Atlassian White Page Flash. 
Hey @DanielDelCore, is there any update on the dark mode modal having a filled background? This is still happening.
Hey @LeonRothYasoon,
This is a known issue that we need to build a solution for by defining some way to pass the correct surface colour down to apps so they are always shown correctly, regardless if the app is shown in a modal or in its own page 
We’re scoping out this issue now, but in the meantime your surface colour usage is correct, I recommend continuing to use it until we’re able to provide you with an API to fix this 
Cheers,
Daniel
1 Like
