TFS: Generating CSS for @import'ed SCSS files doesn't use 'latest version'

I'm using WebWorkbench v3.2.1035.22937 working in a TFS 2010 / VS2010 environment, and I've noticed what seems to be a bug with the way WW handles files in TFS... It involves the auto-generation of files that @import the SCSS file that is being edited.

Let's say I have Common.scss:

body { background-color: red; }

and Page.scss, which imports Common.scss:

@import "Common.scss"
div { border: 1px solid black; }

Let's say that both files (and their generated css files) are initially checked in. Suppose Developer #1 checks out Page.scss and changes the setting for the border thickness to 5px, then checks everything in. But then, let's say Developer #2 checks out and edits Common.scss without having done a 'Get Latest'... VS automatically checks out Common.scss and Common.css, as expected. Suppose now that the Developer #2 changes the body background color from blue to green. When the developer saves the file, WW attempts to rebuild all files that @import the Common.scss, but it uses the local dirty version of the SCSS, not the 'latest' version that is on the server. As a result, the developer now has three files checked out - Common.scss, Common.css, and Page.css (but NOT Page.scss). And critically, the Page.css is now wrong - it will have CSS specifying a div border thickness of 1px, not 5px as was recently changed by Developer #1! If Developer #2 is careless and checks in the Page.css file, then it will be wrong on the server, out-of-sync with its source SCSS file. Presumably, then, another developer might 'Get Latest' with the wrong CSS, deploy to a production web site, and then everything breaks.

It seems to me that if WW executed a 'Get Latest' on the SCSS file prior to regenerating it, then this should resolve the issue.

Two interesting things to note:

1. If Developer #2 looks at the Page.scss file in Solution Explorer after editing Common.scss, it appears to be checked out (has a check-mark instead of a lock) but if you look at the list of Pending Files, the Page.scss file will not appear.
2. If any other developers have the CSS files checked out that are being auto-regenerated as a result of editing the import SCSS, then WW rightly displays an error message saying that the file is locked, and it doesn't update that CSS file. This is a second way that the files could end up out-of-sync, because the other developer will be using a Common.scss that isn't the most recent when he saves his file. If he has already saved his file but still has it checked out, then I don't think anything can fix this situation, not even the fix that I mention above.

Can anyone confirm that they see the same effect occuring, and is there any kind of fix, workaround, or best-practice available to deal with this?

Thanks!!!

Michael Bray

Currently we dont ever trigger a refresh from the source provider (this behavior is fairly specific to certain providers also) rather leaving it up to you to handle. Are you using any automated tooling to build your project prior to deployment? If so you will want to ensure your .css file is rebuilt by this process based on a clean fetch from source control which will remove any local oddities. In the meantime I will investigate if we can add this as an option toggle for you.

Jeremy

Hey Jeremy, thanks for the reply - it's pretty much in line with what I expected. Having an option in WW to get latest would be helpful, but there are still scenarios that wouldn't still create problems, such as other users having the target CSS files checked out. Your suggestion to make sure the CSS gets rebuilt prior to deployment is the best solution, I think, since we would expect all files to be checked in at that point in time. Currently our build and deploy process is manually performed in Visual Studio, but we could always add a pre-build or post-build process to make sure the files get retrieved and/or checked out from TFS and then rebuilt. Is there a command-line program that we can run to regenerate the CSS files?

Yes we do have a command line compiler which is part of the Pro version of WW. If you have a subscription you can find this as a downloadable under Web Workbench in your My Account. We use TeamCity here for handling automated builds - http://www.jetbrains.com/teamcity/ - I would highly recommend having a look :)

Jeremy

Also here is a blog post we put our last year which has a bit more detail about the compiler and how to set it up with your build process - let us know if you need any other help on this though :)

http://www.mindscapehq.com/blog/index.php/2012/04/01/web-workbench-and-your-automated-build-process/

Jeremy