Skip to content

Instantly share code, notes, and snippets.

@shanzantrik
Last active May 30, 2022 05:29
Show Gist options
  • Save shanzantrik/8eace00f6101f06b31e9d4078e073329 to your computer and use it in GitHub Desktop.
Save shanzantrik/8eace00f6101f06b31e9d4078e073329 to your computer and use it in GitHub Desktop.
<!--So the script below is working absolutely fine. All you need to do is fill up the array with post ids which are in classic editor
and then paste localStorage.setItem('gutenberg_post_index', 0);
in the console and refresh the page id or the complete url on edit post page. Then it will start working and converting the remaining
posts.-->
// ==UserScript==
// @name Classic to Block Userscript
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author You
// @match http://test123.local/wp-admin/post.php?post=*&action=edit
// @icon data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant none
// ==/UserScript==
(function() {
'use strict';
nextPost(parseInt(localStorage.getItem('gutenberg_post_index')));
//
// 3. Update this URL to match your site
//
function getURL(postID) {
return `http://test123.local/wp-admin/post.php?post=${postID}&action=edit`;
}
function nextPost(currentIndex) {
// Get current index from LocalStorage
if (Number.isNaN(currentIndex)) {
console.error('No currentIndex found in LocalStorage')
return;
}
//
// 4. Add your post IDs here
//
const postIDs = [452, 449, 443, 434];
const postID = postIDs[currentIndex];
if (!postID) {
console.error('No postID for index =', currentIndex);
return;
}
// Never convert same post twice (prevent potential infinite loop in case of redirect)
// const lastPost = localStorage.getItem('gutenberg_post_id');
// if (lastPost === postID) {
// console.error('Already processed this post!')
// return;
// }
localStorage.setItem('gutenberg_post_index', currentIndex);
localStorage.setItem('gutenberg_post_id', postID);
// Redirect to current post if need be
const url = getURL(postID);
if (url !== window.location.href) {
console.log('Redirecting to post', currentIndex, postID);
window.location.href = url;
return;
}
// Convert post
setTimeout(() => {
convertPost(({ success, error }) => {
if (success) {
console.log(`Converted post ${currentIndex + 1} of ${postIDs.length}`, postID, window.location.href);
} else {
console.error(`Failed to convert post ${currentIndex + 1} of ${postIDs.length}`, postID, window.location.href, error);
}
// Go to next page
nextPost(++currentIndex);
});
}, 3000);
}
function convertPost(callback) {
//has-advanced-toolbar is not present in the dom for the class name --Redc
let toolbar = document.querySelector('.block-library-classic__toolbar');
if (!toolbar) return callback({ error: 'no_toolbar' });
// Click toolbar
toolbar.click();
// Page must be focused for toolbar to be accessible.
waitForMenuToggleButton((menuToggleButton) => {
// Click menu toggle button
menuToggleButton.click();
onNextIdleFrame(() => {
//using components-button components-toolbar-button instead block-editor-block-settings-menu__control to test --Redc
const convertToBlocksButton = document.getElementsByClassName("components-button components-toolbar-button")[0];
// [...document.getElementsByClassName("components-button components-toolbar-button")]
// .find(button => button.textContent === 'Convert to Blocks');
if (!convertToBlocksButton) return callback({ error: 'no_convertToBlocksButton' });
// Click convert to blocks
convertToBlocksButton.click();
// Wait for blocks to render & autosave to complete
setTimeout(() => {
//class="components-button editor-post-publish-button editor-post-publish-button__button is-primary"
const updateButton = document.getElementsByClassName("editor-post-publish-button")[0];
if (!updateButton) return callback({ error: 'no_convertToBlocksButton' });
// Click Update
updateButton.click();
// Wait for update to complete
setTimeout(() => {
return callback({ success: true });
});
}, 3000);
});
});
}
function waitForMenuToggleButton(callback) {
//.block-editor-block-list__block .wp-block .is-selected
const menuToggleButton = document.querySelector('.wp-block-freeform');
if (menuToggleButton) return callback(menuToggleButton);
console.log('Unable to get toggle button in Post Editor. It may be that Wordpress page is not focused. Maybe try clicking on the tab in your browser.')
setTimeout(() => {
waitForMenuToggleButton(callback);
}, 1000);
}
function onNextIdleFrame(callback) {
requestIdleCallback(() => requestAnimationFrame(callback));
}
})();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment