Wrangling The Microsoft MVP Activity Bookmarklet

Sun, 05 Feb 2017 18:57:26 Z

I'm lucky enough to be a Microsoft MVP in Visual Studio and Development Technologies which is absolutely fantastic. I've been having trouble submitting my work though in an efficient manner so I thought I'd put this short post together to show how I got the MVP Submit Activity Bookmarklet to bend to my will in Microsoft Edge so I can help others in a similar situation.

The Problem

The "Submit Activity" interface in the MVP website is not great. It's clunky, slow, requires a lot of fields, and requires a lot of tab switching. I find it off-putting to use which means I don't fill it in when I should. Fortunately Microsoft offered an alternative approach.

All is good. Except that it isn't. There's a couple of issues.

The bookmarklet is fundamentally broken, expecting a relative path in it's code. This means it doesn't work on any page other than within the MVP site!
When fixed, that bookmarklet doesn't work in Chrome asking you to sign in when you already are.
Microsoft Edge doesn't support adding bookmarklets through it's interface.

Fortunately we can fix this.

The Solution

Fixing the Source

First we need to fix the JavaScript snippet so that it actually works.

Here's the original code.

javascript: (function () {
    if (window.myBookmarklet !== undefined) {
        myBookmarklet();
    } else {
        document.body.appendChild(document.createElement('script')).src = '/Content/Scripts/bookmarklet.js?';
    }
})();

See the issue? Yeah that relative src path is never gonna work!

So knowing the correct URL (Since we know that it works within the MVP site) let's update that.

javascript: (function () {
    if (window.myBookmarklet !== undefined) {
        myBookmarklet();
    } else {
        document.body.appendChild(document.createElement('script')).src = 'https://mvp.microsoft.com/Content/Scripts/bookmarklet.js?';
    }
})();

Ok we have fixed the source code but that's only half of the solution. When we try to use the updated bookmarklet code in Chrome (A browser that natively supports bookmarklets) we are greeted with this.

But I'm already signed in! Let's give Edge a try since it's Microsoft product and they always work together right.... Right?

Wrong! As discussed before Microsoft Edge doesn't natively support bookmarklets to we are going to turn to a 3rd paty tool to help us out. Edge Management.

Edge Management To The Rescue!

Edge Management is a handy little tool written by a gentleman called Emmet Gray that allows you to manage your Favourites in a manner more consistent with other browsers. We'll use that to add a working bookmarklet.

First you need to create a standard bookmark. Add any page to your Favourites Bar naming it "Submit MVP Activity".
Then close Edge and open the Edge Management tool. Edit the URL with our updates code snippet.

That should have done the trick. Let's test it.

Voilà! It works... Now I can submit my work in a much more convenient manner and get back to the business of writing great code. (I've got a 2D graphics library to ship!)

Thanks for reading. I hope that you find it useful!

P.S If anyone who is on the team responsible for the MVP website is reading this please create a proper fix, or even better make the entire process less painful. The MVP website user interface is really quite annoying to use.

Filepath too long?

Tue, 05 Aug 2014 13:57:28 Z

I thought I'd write this post as a reminder to myself and as a helper for anyone daft enough to try to use Node on a Windows machine.

Node has a mental system for managing packages which involves deeply nesting dependencies in the node_modules folder. This can lead to all sorts of problems on Windows machines like making the --watch overload for Jekyll die on its ass.

You can't even delete the damn thing properly due to Windows path constraints. It's really annoying to say the least but at least they know about it

Here's a quick method I use to remove the folder when I need to.

Open a command prompt or whatever your shell tool of choice is, navigate to the parent folder of the node_modules folder and type in the following commands:

mkdir foo
robocopy foo node_modules /MIR
del foo
del node_modules

This command uses the robocopy utility and the /MIR "mirror" flag to mirror the empty foo directory to the node_modules folder emptying it out. You can then delete both directories.