Migrate YUI components

I work on an application that uses quite a lot of Javascript components based on the YUI framework, which has been obsolete since around 2014. We recently had the budget to start migrating them to plain Javascript.

How YUI widgets work

Our YUI components use the syntax of YUI3. Sometimes they also use widgets from YUI2 : these have to be rebuilt, or migrated to use another library.

A YUI 3 component is structured as follows:

Continue reading Migrate YUI components

Unable to type text in inputs in IE 11, missing caret

The app I’m working on allows a user working on a document to open a pop-in (Bootstrap popup), select something, validate, and it adds a field on the document, where the user can type something. After working for some time on the widget and changing many things, I test in IE11 and find myself unable to type anything anywhere, after selecting a value. The text input fields are focused (they have the Bootstrap blue halo), but the caret does not appear, and typing doesn’t do anything. Clearing another field that already has some value (using the “X” in the field) makes the inputs work again. All other browsers are working fine. It smells very strongly like a IE bug. A very similar bug is already documented here but it looks like it should have been fixed in 2014, and I’m using Windows 10 (so one would assume it has this fix). Anyway, the bug points towards a focused element being removed from the DOM. I have tried to just focus  something else and then blur  it, but it didn’t work. My salvation came when I realized that the content of the popup was inside an iframe. Selecting and bluring the iframe’s body did the trick :  

Always run Visual Studio as administrator on Windows 10

You might be working with a program that always require administrator privileges, such as a service listening on a port. Up to Windows 10, you just right clicked the devenv exe, and checked “always run as administrator” in the compatibility tab. But in Windows 10, the compatibility tab is missing for the Visual Studio exe. Why? No idea. But here’s how to fix it.

To just run the shortcut as admin : right click on the sortcut > in the “properties” tab, click “advanced”, then check “always run as administrator”. Simple, fast, easy.

If you want to run Visual Studio as administrator also when opening a .sln or .csproj file, it’s not so easy. Here are the logical, coherent, and easy to find steps to fix this: (labels translated to english from french, sorry if it doesn’t match)

  • Open the start menu, type “troubleshoot”, and open “check your computer state and solve problems”
  • On the bottom left, click “troubleshoot compatibility problems”
  • Click on “advanced” on the left then “run as administrator”
  • Click again on “advanced”, then uncheck “automatically fix”, then “next”
  • Search for Visual Studio in the list, then “next”
  • Make sure “fix the program” is checked, then “next”
  • Select “troubleshoot the program” (bottom option)
  • Check “the program requires additional rights”, then “next”
  • Click “test the programe” then “next”
  • Select “save the parameters for the program” then “close”

Easy, logical, simple. Thanks Microsoft!

Git-svn and branches

I’m using git-svn to leverage the power of git while the rest of the company prefers the simplicity of svn.

I have created a local branch, intending to merge it in the trunk/master when I’m done, but it turns out it’s much more complicated than expected. So, I want to commit it on svn.
I already have checked out the full repository.

The most simple solution I have found; all other solutions fiddle with the git config files, and I don’t like it:

  • Checkout the branch: git checkout mybranch
  • Rename the local branch: git branch -m mybranch-temp
  • Create a remote branch “mybranch” in SVN using Tortoise SVN
  • Fetch the SVN repository to get the new branch: git svn fetch
  • Check that the new SVN branch has been fetched: git branch -r (or git branch -avv )
  • Get back to the master branch: git checkout master
  • Checkout the remote branch: git checkout -b mybranch-svn origin/mybranch
  • Rebase my local branch into the local svn branch: git rebase mybranch-temp
  • Commit the branch in svn: git svn dcommit ; use --dry-run  to check the branch it will commit to, because sometimes it still commits to the trunk (I haven’t found out why).

Unit testing MongoDB queries

When writing unit tests, it’s common to stop at the database access layer.
You might have a “dumb” data access layer that just passes stored procedure names and parameters to the SQL database, for instance.
It’s usually very hard to test this layer, since it requires either that your build server has access to a SQL Server instance, or that a SQL Server is running on the build server.
Plus, we’re getting out of unit tests and are entering integration tests, here.

Using a more advanced tool like Entity Framework, in order to test your complex EF queries, there are usually methods to insert fake data into a fake container, like Test Doubles, InMemory, or Effort.

Using MongoDB, you might encounter the same problem : how do I test that my complex queries are working ?

Here for instance, I get the possible colors of a product; how do I know it works using unit tests?

MongoDB has an “inMemory” storage engine, but it’s reserved to the (paid) Enterprise edition. Fortunately, since 3.2, even the Community edition has a not-very-well-documented “ephemeralForTests” storage engine, which loads up an in-memory Mongo instance, and does not store anything on the hard drive (but has poor performances). Exactly what we need!

Before running the data access layer tests, we will need to fire up an in-memory instance of MongoDB.
This instance will be common to all the tests for the layer, otherwise the test runner will fire up new tests faster than the system releases resources (file and ports locks).

You will have to extract the MongoDB binaries in your sources repository somewhere, and copy them besides your binaries on build.

The following wrapper provides a “Query” method that allows us to access the Mongo instance through command-line, bypassing the data access layer, in order to insert test data or query insertion results.

We’re using the IClassFixture  interface of xUnit to fire up a MongoDaemon instance that will be common to all our tests using it.
It means we need to clean up previously inserted test data at each run.

There you have it: a kind-of-easy way to test your Mongo data access layer.

Nested sets references

Just bookmarking a few things here.

Modify copy/paste format depending on target

Sometimes you want to copy tabular data, and paste it differently depending on the target. For instance, you want CSV when you paste in your text editor, and HTML when you paste it in an email.

Fortunately, some nice fellow has created a helper class to handle all that for you. And it’s even available on GitHub!

To sum it up, the Clipboard  class has a SetDataObject method. A DataObject can get multiple contents (with different DataFormats) through multiple calls of the SetData(string, object)  method.
So basically, you should create a DataObject, then call SetData once with the HTML, and once with text. The trick is that the HTML needs special formatting to work.

Start a WPF application in the notification area with Caliburn.Micro

Sometimes you’re writing a quick utility app that you wish to start directly in the notification area (near the clock), and not display anything on startup.
It’s actually very simple using Caliburn.Micro.

You probably already have customized your application bootstrapper already. All you have to do is modify the OnStartup  method from DisplayRootViewFor<T>  to displaying a custom tooltip. Here I’m using the Hardcodet.NotifyIcon.Wpf Nuget package:

It seems obvious in retrospect, but it took me a while to find this, because I don’t modify the app bootstrapper often, so I forgot about this method.

Don’t forget to add behavior to this icon! Double-click, context menu…

I have created a Caliburn.Micro + MahApps template app if you wish a starting point : https://github.com/cosmo0/Caliburn.MahApps.Metro.Template

Mapping DataTables to domain objects

It’s always a pain to work with DataTables and DataSets. You’re always typing these pesky column names, it doesn’t necessarily represents the actual data model (if there are nested data), there is no type safety until runtime, it’s pretty hard to use Linq on your results… the list goes on.

Fortunately, there is a simple solution: AutoMapper. It’s very simple to cast a DataTable to a list of objects:

Mocking static methods

I’m working on a pretty old application with no unit tests whatsoever, and I’m trying to write some as I add features and fix bugs.

After successively finding out about MS Fakes, then that it’s only included in VS2012+ Premium/Ultimate and very hard to include in a continuous integration chain, I was pretty stumped until I found this, which works incredibly well.

Another option to transform the static method into a static Func or Action. For instance.

Original code:

You want to “mock” the Add method, but you can’t. Change the above code to this:

Existing client code doesn’t have to change (maybe recompile), but source stays the same.

Now, from the unit-test, to change the behavior of the method, just reassign an in-line function to it:

Put whatever logic you want in the method, or just return some hard-coded value, depending on what you’re trying to do.

This may not necessarily be something you can do each time, but in practice, I found this technique works just fine.