diff --git a/lib/options-handler.js b/lib/options-handler.js
index 21e754bec..2bb78a522 100755
--- a/lib/options-handler.js
+++ b/lib/options-handler.js
@@ -242,6 +242,17 @@ export class ClientOptionsHandler {
                 }
             }
         }
+        for (const langGroup of Object.values(libraries)) {
+            for (const libGroup of Object.values(langGroup)) {
+                const versions = Object.values(libGroup.versions);
+                versions.sort((a, b) => semverParser.compare(asSafeVer(a.semver), asSafeVer(b.semver), true));
+                let order = 0;
+                // Set $order to index on array. As group is an array, iteration order is guaranteed.
+                for (const lib of versions) {
+                    lib['$order'] = order++;
+                }
+            }
+        }
         return libraries;
     }
 
diff --git a/lib/utils.ts b/lib/utils.ts
index 5f50245f0..bb7311700 100644
--- a/lib/utils.ts
+++ b/lib/utils.ts
@@ -424,8 +424,8 @@ export function countOccurrences<T>(collection: Iterable<T>, item: T): number {
     return result;
 }
 
-export function asSafeVer(semver: string | number | null) {
-    if (semver !== null) {
+export function asSafeVer(semver: string | number | null | undefined) {
+    if (semver != null) {
         if (typeof semver === 'number') {
             semver = `${semver}`;
         }
diff --git a/static/widgets/libs-widget.ts b/static/widgets/libs-widget.ts
index ae4558c01..cc4bd6683 100644
--- a/static/widgets/libs-widget.ts
+++ b/static/widgets/libs-widget.ts
@@ -281,7 +281,13 @@ export class LibsWidget {
         versions.append(noVersionSelectedOption);
         let hasVisibleVersions = false;
 
-        for (const versionId in lib.versions) {
+        const versionsArr = Object.keys(lib.versions).map(id => {
+            return {id: id, order: lib.versions[id]['$order']};
+        });
+        versionsArr.sort((a, b) => b.order - a.order);
+
+        for (const libVersion of versionsArr) {
+            const versionId = libVersion.id;
             const version = lib.versions[versionId];
             const option = $('<option>');
             if (version.used) {
diff --git a/test/options-handler.js b/test/options-handler.js
index fd8253ced..49f50745d 100644
--- a/test/options-handler.js
+++ b/test/options-handler.js
@@ -172,6 +172,7 @@ describe('Options handler', () => {
                     options: [],
                     versions: {
                         noPaths: {
+                            $order: 2,
                             path: [],
                             version: 'no paths',
                             liblink: [],
@@ -184,6 +185,7 @@ describe('Options handler', () => {
                             hidden: false,
                         },
                         onePath: {
+                            $order: 0,
                             path: ['/dev/null'],
                             version: 'one path',
                             staticliblink: [],
@@ -195,6 +197,7 @@ describe('Options handler', () => {
                             hidden: false,
                         },
                         twoPaths: {
+                            $order: 1,
                             path: ['/dev/null', '/dev/urandom'],
                             staticliblink: [],
                             dependencies: [],
@@ -218,6 +221,7 @@ describe('Options handler', () => {
                     options: [],
                     versions: {
                         std: {
+                            $order: 0,
                             libpath: [],
                             path: [],
                             version: 'std',
@@ -241,6 +245,7 @@ describe('Options handler', () => {
                     options: [],
                     versions: {
                         trunk: {
+                            $order: 0,
                             libpath: [],
                             path: [],
                             version: 'trunk',