Since FB changed the UI of Messenger, it stopped working.

Here is my solution:

$(document).ready(function() {
/*Run after the sidebar loaded*/
var keepGettingConvThreads = setInterval(
()=>{
if(document.querySelector(".g0mhvs5p")){/*if the sidebar exists*/
/*Stop the loop*/
clearInterval(keepGettingConvThreads);
/*get the sidebar*/
var convThreads = document.querySelector(".g0mhvs5p");
/*let it looks like [<] in the beginning*/
$('body').append('');
/*The appearance of the switch. The switch covers the head icon of the chat, and auto-hide itself.*/
styleTagPlugIn(
"#showHideButton",
{
"background-color":"#000",
"color":"#FFF",
"position":"fixed",
"top":0,
"left": (convThreads.offsetWidth + "px"),
"z-index":1000,
"border-style":"solid",
"border-width":"10px",
"border-color":"#000",
"font-size":"40px",
"width":"64px",
"height":"64px",
"opacity": 0,
"transition": "opacity .5s"
}
);
/*And the switch appear when the mouse hovering on it.*/
styleTagPlugIn("#showHideButton:hover", {"opacity":1});
/*   [<] for hiding the sidebar <--> [>] for showing the sidebar    */
$("#showHideButton").click(function(){
var convThreads = document.querySelector(".g0mhvs5p");
if(convThreads.style.display == 'none'){
convThreads.style.display = 'block';
showHideButton.value = "<";
showHideButton.style["left"] = convThreads.offsetWidth + "px";
}else {
convThreads.style.display = 'none';
showHideButton.value = ">";
showHideButton.style["left"] = 0;
}
});
}
}, 500
);
});
function styleTagPlugIn(query, list){
var element = document.createElement("style");
document.body.appendChild(element);
element.innerText += query + '{\n';
for(var key in list){
element.innerText += "\t" + key + ": " + list[key] + ";\n";
}
element.innerText += '}'
}

Ahh yeah, it's broken again. New solution with UI improvement:

// ==UserScript==
// @name Toggle Messenger Sidebar [Modified]
// @namespace http://jamesswandale.com/
// @version 0.2.1
// @description Button to hide messengers list of conversations
// @match https://www.messenger.com/*
// @copyright 2015+, James Swandale
// @require http://code.jquery.com/jquery-latest.js
// ==/UserScript==
$(document).ready(function() {
/*Run after the sidebar loaded*/
var keepGettingConvThreads = setInterval(
()=>{
if(document.querySelector('[role="navigation"]')){/*if the sidebar exists*/
/*Stop the loop*/
clearInterval(keepGettingConvThreads);
/*get the sidebar*/
var convThreads = document.querySelector('[role="navigation"]');
/*let it looks like [<] in the beginning*/
$('body').append('<input type="button" value="<" id="showHideButton" style="">');
/*The appearance of the switch. The switch auto-hide itself.*/
styleTagPlugIn(
"#showHideButton",
{
"background-color":"#000",
"color":"#FFF",
"position":"fixed",
"top":0,
//"left": (convThreads.offsetWidth + "px"),
"left": "-60px",
"z-index":0,
"border-style":"solid",
"border-width":"10px",
"border-color":"#000",
"font-size":"40px",
//"width":"64px",
"width":"64px",
//"height":"64px",
"height":"100vh",
"opacity": 0,
//"transition": "opacity .5s"
"transition": "opacity .5s, left .5s"
}
);
/*And the switch appear when the mouse hovering on it.*/
styleTagPlugIn("#showHideButton:hover", {"opacity":1, "left": "0px"});
/*   [<] for hiding the sidebar <--> [>] for showing the sidebar    */
$("#showHideButton").click(function(){
var convThreads = document.querySelector('[role="navigation"]');
if(convThreads.style.display == 'none'){
convThreads.style.display = 'block';
showHideButton.value = "<";
//showHideButton.style["left"] = convThreads.offsetWidth + "px";
}else {
convThreads.style.display = 'none';
showHideButton.value = ">";
//showHideButton.style["left"] = 0;
}
});
}
}, 500
);
});
function styleTagPlugIn(query, list){
var element = document.createElement("style");
document.body.appendChild(element);
element.innerText += query + '{\n';
for(var key in list){
element.innerText += "\t" + key + ": " + list[key] + ";\n";
}
element.innerText += '}'
}