Bookmarklet: Converts Whatsapp Web interface into native app like

web_whats_appify.js

javascript:(function(){
	document.querySelector('meta[name="viewport"]').content = 'width=device-width, initial-scale=1.0';
	const st = document.body.lastChild.tagName === 'STYLE' ? document.body.lastChild : document.createElement('style');
	document.body.append(st);
	document.body.style.zoom = window.devicePixelRatio;
	const frame = document.getElementsByClassName('_1XkO3')[0];
	window.onpopstate = e => {
		let btn = document.querySelector('button.bmJTq');
		if(btn){
			btn.click();
		} else if(btn = document.querySelector('button._1jtVV, div._26lC3[title="Close"], button._18eKe')) {
			btn.click();
		} else {
			document.getElementsByClassName('bSwEu')[0].nextElementSibling.focus();
			frame.scrollLeft -= 10000;
		}
	};
	document.body.onclick = e => {
		const head = document.getElementsByClassName('_2YnE3')[0];
		if(head.firstChild.className != '_3UaCz'){
			let span = document.createElement('SPAN');
			span.className = '_3UaCz';
			span.style.marginRight = '5px';
			span.innerHTML = '<svg viewBox="0 0 1000 1000" width="24" height="24"><g><path fill="currentColor" d="M990,503.4c0,25.9-21,46.9-46.9,46.9H56.9c-25.9,0-46.9-21-46.9-46.9v-4.6c0-25.9,21-46.9,46.9-46.9h886.1c25.9,0,46.9,21,46.9,46.9V503.4z"/><path fill="currentColor" d="M430.9,131.1c18.3,18.3,18.3,48.1,0,66.4L93.1,535.2c-18.3,18.3-48.1,18.3-66.4,0l-2.9-2.9C5.5,514,5.5,484.3,23.9,466l337.7-337.7c18.3-18.3,48.1-18.3,66.4,0L430.9,131.1z"/><path fill="currentColor" d="M430.9,868.9c18.3-18.3,18.3-48.1,0-66.4L93.1,464.8c-18.3-18.3-48.1-18.3-66.4,0l-2.9,2.9C5.5,486,5.5,515.7,23.9,534l337.7,337.7c18.3,18.3,48.1,18.3,66.4,0L430.9,868.9z"/></g></svg>';
			head.prepend(span);
		}
		if (e.target.closest('._3m_Xw') || e.target.closest('._2cNrC')){
			frame.scrollLeft += 10000;
		}
		document.querySelector('header ._2YnE3').onclick = () => {
			setTimeout(()=>{
				document.querySelector('button._18eKe').click();
				document.getElementsByClassName('bSwEu')[0].nextElementSibling.focus();
				frame.scrollLeft -= 10000;
			}, 1);
		};
		document.querySelector('header ._24-Ff').onclick = () => {
			setTimeout(()=>{
				frame.scrollLeft += 10000;
			}, 1);
		};
	};
	st.innerText = `
	._3ev9-, ._1XkO3{
		min-width: unset!important;
	}
	._3ev9-{
		flex-wrap: wrap;}
	.three .ldL67,.two .ldL67 {
		flex: 0 0 100%!important;
	}
	.three ._3ArsE{
		overflow: initial;
	}
	#app ._1XkO3{
		overflow: hidden;
	}
	.three ._1bLj8{
		position: relative!important;
	}
	._1iwk6 > div {
		flex: 1 0 100%;position: relative;
	}
	._1iwk6{
		flex-direction: row;
	}
	._2YnE3{
		display: flex;align-items: center;
	}
	._1Mcu-{
		min-width: unset;
	}
	._2wUmf._1q25n.focusable-list-item > div:first-of-type {
		max-width: 75vw!important;
	}
	.M_gdf{
		max-width: 75vw;
	}`;
})();