faustjs-wordpress-plugin-playground.html

<iframe id="wp-playground" style="width: 100%; height: 100%" frameBorder="0"></iframe>
<script type="module">
   import {
      startPlaygroundWeb
   } from 'https://unpkg.com/@wp-playground/client/index.js';
   const client = await startPlaygroundWeb({
      iframe: document.getElementById('wp-playground'),
      remoteUrl: `https://playground.wordpress.net/remote.html`,
      blueprint: {
         landingPage: '/wp-admin/options-general.php?page=faustwp-settings',
         preferredVersions: {
            php: '8.1',
            wp: 'latest',
         },
         steps: [{
               step: 'login',
               username: 'admin',
               password: 'password',
            },
            {
               step: 'installPlugin',
               pluginZipFile: {
                  resource: 'wordpress.org/plugins',
                  slug: 'faustwp',
               },
            },
            {
               step: 'installPlugin',
               pluginZipFile: {
                  resource: 'wordpress.org/plugins',
                  slug: 'wp-graphql',
               },
            }
         ],
      },
   });
   await client.run({
      code: `<?php
      require("/wordpress/wp-load.php");
   
      // Stub required Faust.js WordPress Plugin functions.
      function faustwp_update_setting( $name, $value ) {
         $settings          = faustwp_get_settings();
         $settings[ $name ] = $value;

         update_option( 'faustwp_settings', $settings );
      }
      
      function faustwp_get_settings() {
         $settings = get_option( 'faustwp_settings', array() );
         
         return apply_filters( 'faustwp_get_settings', $settings );
      }
      
      // Set required permalink structure.
      global $wp_rewrite;
      $wp_rewrite->set_permalink_structure('/%postname%/');
      $wp_rewrite->flush_rules();

      // Update Front-end site URL.
      faustwp_update_setting('frontend_uri', 'http://localhost:8888');
   `,
   });
</script>