Project Online: What’s with the ribbon icons getting jumbled?
Published Mar 06 2019 01:51 PM 715 Views
Brass Contributor
First published on TECHNET on Mar 20, 2015

*** 7/28/2015 - Hopefully you will have seen the last of this - some changes to our build process to ensure correct versioning of the image maps should ensure you see the right icons when they change next time ***

*** 6/4/2015 - Appear we have a fresh round of this issue happening - thanks to Ben Howard for confirming that Ctrl-F5 does NOT resolve this - but clearing the files from your Internet cache does ***

Over the last week or so we have had a few reports of the ribbon icons in PWA getting all mixed up.  The text was just fine – but perhaps where Publish should be there would be a printer.  Or Close was getting a nice compass icon.  Usually this would just appear to go away on its own after a short time – but what’s going on?

Here is an example (and thanks to one of our customers for sharing – I haven’t actually seen this on my Project Online tenant) – and we can see the icons are all very odd!

To resolve the problem certainly deleting the local Internet Explorer cache will get a good set of icons working again.  It may even be that Ctrl-F5 will achieve the same – as that should force a re-download of all the components of the page (I haven’t been able to confirm as I haven’t had a repro – but I’d love to hear if this does fix things).  It should also be possible to remove just a couple of files from the local cache and get things working too – and taking a look at these files will help understand what is going on here (but not the ‘why’ – which I am trying to establish – along with seeing if we can stop this happening).

The files in question are ones like ps32x32.png and ps16x16.png – and these contain sets of icons that are used in the ribbon.  As an example the following two images are from my current on-premises Project Server 2013 and one downloaded from a Project Online tenant.

Project Server 2013                                                                                    Project Online

As you can see we have updated the Project Online one, and it has a few more icons than Project Online – and they are in a different order.  The problem comes when we push out an update and you have a cached version of the older map – and the wrong icon gets referenced by the new code.  Obviously this shouldn’t happen – I am investigating if we need to somehow expire the old maps when an update goes out – or use some other technique to resolve this.

You may also have seen these maps show up in other situations – such as when the cascading style sheet does not download correctly and you see these complete maps showing up on the page.  Again a Ctrl-F5 will normally resolve this issue if you happen to see it.  I haven’t seen this recently – and haven’t seen either symptom with on-premises Project Server 2013 – but I guess a similar condition could occur with an update.

The reason these image maps are used is to reduce the download time for the page – quicker to download one 448 x 416 image than 182 of the 32 x 32 images.

Version history
Last update:
‎Mar 06 2019 01:51 PM
Updated by: