# Code Snippet Module — Manual Test Snippets

Copy-paste codes for QA. Prefix every test snippet title with `[TEST]` so you can find and delete them easily.

**Admin:** `wp-admin/admin.php?page=powersuite-code-snippet`  
**Add new:** `...&action=add`

---

## How to use this file

1. Enable the **Code Snippet** module in PowerSuite.
2. Create one snippet per test (or group related tests).
3. Set **Active** ON unless the test says otherwise.
4. Verify on the frontend using **View Source** or DevTools.
5. Look for `<!-- WP PowerSuite Code Snippet:` comments in HTML output.

**Legend**

| Tag | Meaning |
|-----|---------|
| FREE | Works without PRO |
| PRO | Requires valid PRO license |
| AUTO | Use **Auto Insert** + pick location |
| SC | Use **Shortcode** insert method |

---

## 1. HTML snippets (FREE)

### 1.1 Universal HTML marker (any location)

Use this as the default body for location tests. Change `LOCATION` to match the insertion point (e.g. `header`, `footer`, `before_content`).

```html
<div id="wpps-test-LOCATION" class="wpps-test-marker" data-wpps-location="LOCATION" style="background:#fff3cd;border:2px solid #ffc107;padding:10px;margin:8px 0;font-family:sans-serif;font-size:14px;">
  <strong>WPPS TEST</strong> — Location: <code>LOCATION</code>
</div>
```

**Pass:** Visible on the page at the chosen location.  
**View source:** Wrapped in `<!-- WP PowerSuite Code Snippet: ... -->` comments.

---

### 1.2 Site Wide Header

- **Type:** HTML  
- **Insert:** AUTO → Site Wide Header  

```html
<div id="wpps-test-header" class="wpps-test-marker" style="display:none;">WPPS header marker</div>
<!-- Visible check: view source inside <head> or early body -->
<meta name="wpps-test-header" content="loaded">
```

**Pass:** `<meta name="wpps-test-header"` appears in page source `<head>`.

---

### 1.3 Site Wide Body

- **Insert:** AUTO → Site Wide Body  

```html
<div id="wpps-test-body" class="wpps-test-marker" style="background:#d1ecf1;border:2px solid #0c5460;padding:10px;">
  WPPS TEST — Site Wide Body (immediately after &lt;body&gt;)
</div>
```

---

### 1.4 Site Wide Footer

- **Insert:** AUTO → Site Wide Footer  

```html
<div id="wpps-test-footer" class="wpps-test-marker" style="background:#f8d7da;border:2px solid #721c24;padding:10px;">
  WPPS TEST — Site Wide Footer
</div>
```

---

### 1.5 Before / After Content

Create a **post or page** with at least 4 paragraphs, then add two snippets:

**Before content:**

```html
<p id="wpps-test-before-content" class="wpps-test-marker" style="background:#e2e3e5;padding:8px;">WPPS TEST — Before Content</p>
```

**After content:**

```html
<p id="wpps-test-after-content" class="wpps-test-marker" style="background:#e2e3e5;padding:8px;">WPPS TEST — After Content</p>
```

---

### 1.6 Percentage through content (25%, 50%, 75%)

Use the same HTML; only change the location and id:

```html
<p id="wpps-test-content-50" class="wpps-test-marker" style="background:#cce5ff;padding:8px;">WPPS TEST — 50% through content</p>
```

Repeat for `content_25`, `content_33`, `content_66`, `content_75`, `content_80`.

---

### 1.7 Before / After Paragraph

Post needs multiple `<p>` tags. Set **Position** to `2` for paragraph 2.

**Before paragraph 2:**

```html
<p id="wpps-test-before-p2" class="wpps-test-marker" style="background:#d4edda;padding:8px;">WPPS TEST — Before paragraph 2</p>
```

**After paragraph 2:**

```html
<p id="wpps-test-after-p2" class="wpps-test-marker" style="background:#d4edda;padding:8px;">WPPS TEST — After paragraph 2</p>
```

---

### 1.8 Archive / excerpt / loop

Test on a **category archive** with 3+ posts.

**Before excerpt:**

```html
<div class="wpps-test-marker" style="font-size:12px;color:#856404;">WPPS — Before excerpt</div>
```

**After excerpt:**

```html
<div class="wpps-test-marker" style="font-size:12px;color:#856404;">WPPS — After excerpt</div>
```

**Between posts:**

```html
<hr class="wpps-test-marker" data-wpps="between-posts" style="border:2px dashed #6c757d;">
```

**Before post #2** (Position = 2):

```html
<div class="wpps-test-marker">WPPS — Before post 2 in loop</div>
```

---

### 1.9 CSS selector insertion

Add a wrapper to a test page if your theme lacks `#main`:

```html
<div id="wpps-selector-target" style="min-height:40px;background:#eee;padding:10px;">Target element for selector tests</div>
```

**Selector:** `#wpps-selector-target`  
**Modes:** before_element | after_element | start_element | end_element  

**Snippet code:**

```html
<span class="wpps-test-marker" style="background:#ffeeba;padding:4px 8px;">WPPS — Selector insert</span>
```

**Element index test:** same selector, index `0` → only first match.

---

### 1.10 Shortcode only (SC)

- **Insert:** Shortcode  
- **Custom shortcode (optional):** `wpps_demo_box`  

```html
<div id="wpps-test-shortcode" class="wpps-test-marker" style="background:#e7f3ff;border:1px solid #0073aa;padding:12px;">
  WPPS TEST — Shortcode output only
</div>
```

**Page content:** `[wpps_code id="SNIPPET_ID"]` or `[wpps_demo_box]`

**Pass:** Output only where shortcode is placed, nowhere else.

---

## 2. CSS snippets (FREE)

### 2.1 Global red outline on test markers

- **Insert:** AUTO → Site Wide Header (or Footer)  

```css
.wpps-test-marker {
  outline: 3px solid #dc3545 !important;
  outline-offset: 2px;
}
body.wpps-css-loaded {
  /* optional hook if you add class via JS */
}
```

**Pass:** All `.wpps-test-marker` elements show red outline.

---

### 2.2 Hide admin bar on frontend (visual test)

```css
@media screen and (min-width: 783px) {
  #wpadminbar { opacity: 0.3; }
}
```

Remove after test.

---

### 2.3 Load as file test (CSS)

Enable **Load this snippet from a file** and/or global **Load Snippets as Files**.

```css
#wpps-test-file-css::before {
  content: "CSS file load OK";
  display: block;
  background: #28a745;
  color: #fff;
  padding: 6px 10px;
  font-size: 13px;
}
```

Add companion HTML snippet in footer:

```html
<div id="wpps-test-file-css"></div>
```

**Pass:** Network tab shows `wp-content/wpps/wpps-snippets/*.css` loaded.

---

## 3. JavaScript snippets (PRO)

### 3.1 Console smoke test

- **Insert:** AUTO → Site Wide Footer  

```javascript
console.log('[WPPS TEST] JS snippet loaded', window.location.pathname);
document.documentElement.setAttribute('data-wpps-js', '1');
```

**Pass:** Console message; `<html data-wpps-js="1">` in Elements panel.

---

### 3.2 DOM marker after load

```javascript
(function () {
  var el = document.createElement('div');
  el.id = 'wpps-js-banner';
  el.textContent = 'WPPS JS TEST — loaded';
  el.style.cssText = 'position:fixed;bottom:0;right:0;background:#212529;color:#fff;padding:6px 10px;font:12px sans-serif;z-index:99999;';
  document.body.appendChild(el);
})();
```

Remove after test (fixed overlay).

---

### 3.3 CSS selector + JS together

Use with selector location on `#wpps-selector-target`:

```javascript
(function () {
  var t = document.querySelector('#wpps-selector-target');
  if (t) t.setAttribute('data-wpps-js-selector', 'ok');
})();
```

---

### 3.4 Load as file test (JS)

```javascript
window.wppsJsFileTest = true;
console.log('[WPPS TEST] JS file enqueue OK');
```

**Pass:** Network tab shows `.js` from `wp-content/wpps/wpps-snippets/`.

---

## 4. PHP snippets (PRO)

> Do **not** include `<?php` tags — the editor stores raw PHP only.

### 4.1 Run Everywhere — footer comment

- **Insert:** AUTO → Run Everywhere  

```php
add_action( 'wp_footer', function () {
    echo '<!-- WPPS TEST run_everywhere OK -->';
}, 99 );
```

**Pass:** Comment in frontend page source before `</body>`.

---

### 4.2 Admin Only — admin notice

- **Insert:** AUTO → Admin Only  

```php
add_action( 'admin_notices', function () {
    if ( ! current_user_can( 'manage_options' ) ) {
        return;
    }
    echo '<div class="notice notice-info"><p>WPPS TEST — Admin Only PHP snippet is running.</p></div>';
}, 5 );
```

**Pass:** Notice on wp-admin only, not on frontend.

---

### 4.3 Frontend Only — visible footer box

- **Insert:** AUTO → Frontend Only  

```php
add_action( 'wp_footer', function () {
    if ( is_admin() ) {
        return;
    }
    echo '<div id="wpps-test-fe-only" style="background:#055160;color:#fff;padding:8px;text-align:center;font:13px sans-serif;">WPPS TEST — Frontend Only PHP</div>';
}, 99 );
```

---

### 4.4 Frontend Conditional Logic — logged-in users

- **Insert:** AUTO → Frontend Conditional Logic  
- **Conditional (PRO):** Logged in = Yes  

```php
add_action( 'wp_footer', function () {
    echo '<!-- WPPS TEST frontend_conditional_logic logged-in -->';
}, 99 );
```

**Pass:** Comment when logged in; absent when logged out.

---

### 4.5 Custom shortcode registered via PHP

- **Insert:** AUTO → Run Everywhere  

```php
add_action( 'init', function () {
    add_shortcode( 'wpps_php_hello', function () {
        return '<p class="wpps-test-marker">WPPS TEST — PHP shortcode [wpps_php_hello]</p>';
    });
}, 20 );
```

**Page content:** `[wpps_php_hello]`

---

### 4.6 Priority / hook order test

Create **two** Run Everywhere snippets:

**Snippet A (Priority 5):**

```php
add_action( 'wp_footer', function () {
    echo '<!-- WPPS PRIORITY A (5) -->';
}, 99 );
```

**Snippet B (Priority 20):**

```php
add_action( 'wp_footer', function () {
    echo '<!-- WPPS PRIORITY B (20) -->';
}, 99 );
```

**Pass:** In source, comment A appears before B.

---

### 4.7 Load PHP from file

Enable file loading. Use Frontend Only or Run Everywhere:

```php
add_action( 'wp_footer', function () {
    echo '<!-- WPPS TEST php_file_include OK -->';
}, 99 );
```

**Pass:** File exists at `wp-content/wpps/wpps-snippets/{slug}-{id}.php`; comment still outputs.

---

## 5. Admin area HTML (FREE)

### 5.1 Admin header

- **Insert:** AUTO → Admin header  

```html
<style>.wpps-admin-header-test{color:#0d6efd;font-weight:bold;}</style>
<span class="wpps-admin-header-test">WPPS admin header</span>
```

---

### 5.2 Admin footer

```html
<script>console.log('[WPPS TEST] admin footer snippet');</script>
```

**Pass:** Message in browser console on any admin screen.

---

## 6. WooCommerce snippets (FREE HTML / PRO JS)

Requires WooCommerce active. Use HTML markers; swap `LOCATION` in id.

**Shop loop — before:**

```html
<p id="wpps-test-woo_before_shop_loop" class="wpps-test-marker" style="background:#f5c6cb;padding:8px;">WPPS — Before shop loop</p>
```

Duplicate for each Woo location:

| Location slug | Suggested id |
|---------------|--------------|
| `woo_before_shop_loop` | `wpps-test-woo_before_shop_loop` |
| `woo_after_shop_loop` | `wpps-test-woo_after_shop_loop` |
| `woo_before_single_product` | `wpps-test-woo_before_single_product` |
| `woo_after_single_product` | `wpps-test-woo_after_single_product` |
| `woo_before_add_to_cart` | `wpps-test-woo_before_add_to_cart` |
| `woo_after_add_to_cart` | `wpps-test-woo_after_add_to_cart` |
| `woo_before_cart` | `wpps-test-woo_before_cart` |
| `woo_after_cart` | `wpps-test-woo_after_cart` |
| `woo_before_checkout` | `wpps-test-woo_before_checkout` |
| `woo_after_checkout` | `wpps-test-woo_after_checkout` |

---

## 7. Conditional logic test snippets (PRO)

Base HTML (Auto Insert → Site Wide Footer):

```html
<div id="wpps-test-conditional" class="wpps-test-marker" style="background:#cfe2ff;padding:10px;">
  WPPS TEST — Conditional logic matched
</div>
```

Enable **Smart Conditional Logic** and configure rules:

| Test # | Rule | Value | Visit | Expected |
|--------|------|-------|-------|----------|
| C1 | URL contains | `/about` | About page vs Home | Shows only on About |
| C2 | User role equals | `administrator` | Admin vs subscriber | Admin only |
| C3 | Logged in | `yes` | Logged in vs out | Logged in only |
| C4 | Type of page equals | `is_front_page` | Homepage vs other | Homepage only |
| C5 | Type of page equals | `is_page` | Static page vs single post | Pages only |
| C6 | Post type equals | `post` | Single post vs page | Posts only |
| C7 | Show when rules do NOT match | URL contains `/secret` | Normal page | Inverted logic |

**OR group test:** Group 1: URL contains `/shop` AND logged in. Group 2 (OR): User role equals `editor`.

---

## 8. Device targeting test snippets (PRO)

Same visible HTML; change **Device Type**:

```html
<div id="wpps-test-device" class="wpps-test-marker" style="background:#d1e7dd;padding:10px;">
  WPPS TEST — Device targeting active
</div>
```

| Device | How to verify |
|--------|----------------|
| Desktop | Normal browser window |
| Mobile | DevTools → iPhone UA |
| Tablet | DevTools → iPad UA |

---

## 9. Scheduling test (FREE)

Use any HTML marker. Enable **Schedule snippet**:

| Test | Start | End | Expected |
|------|-------|-----|----------|
| S1 | Tomorrow | empty | Hidden today |
| S2 | Yesterday | Tomorrow | Visible today |
| S3 | Last week | Last week | Hidden (expired) |

---

## 10. Error handling & auto-deactivate (PRO)

Use **Frontend Conditional Logic** or **Run Everywhere**. Enable **Error Logging** in settings.

### 10.1 Throwable (should auto-deactivate)

```php
throw new Exception( 'WPPS TEST intentional error' );
```

**Pass:** Snippet drafted; admin notice; entry in Error Logs.

---

### 10.2 Fatal error (shutdown handler)

```php
wpps_test_undefined_function_call();
```

**Pass:** Snippet auto-deactivated; site does not white-screen permanently.

---

### 10.3 Blocked at save — syntax error

```php
echo ( ;
```

**Pass:** Save rejected — "PHP syntax error".

---

### 10.4 Blocked patterns (save or silent no-run)

Try each; expect block or empty output:

```php
exit( 'WPPS should block exit' );
```

```php
eval( 'echo 1;' );
```

```php
system( 'whoami' );
```

```php
exec( 'whoami' );
```

```php
shell_exec( 'whoami' );
```

---

### 10.5 Allowed PHP (should save and run)

```php
add_action( 'wp_footer', function () {
    echo '<!-- WPPS TEST safe hook OK -->';
}, 99 );
```

---

## 11. PRO license gate tests

### 11.1 Without PRO — should NOT save or run

**JS (save test):**

```javascript
console.log('PRO gate JS test');
```

**PHP (activate test — create while PRO active, then deactivate license):**

```php
echo '<!-- PRO gate PHP -->';
```

### 11.2 Without PRO — HTML should still work

```html
<p id="wpps-test-free-html">WPPS FREE HTML OK</p>
```

---

## 12. Safe mode tests

Create active footer HTML:

```html
<div id="wpps-test-safe-mode" class="wpps-test-marker">WPPS — Safe mode test marker</div>
```

| Mode | How | Expected |
|------|-----|----------|
| Normal | Visit frontend | Marker visible |
| URL safe mode | Admin URL + `&wpps-cs-safe-mode=1`, browse frontend logged in | Marker hidden for admin |
| URL safe mode | Incognito (not admin) | Marker still visible |
| Global safe mode | Settings → Global Safe Mode ON | Marker hidden for everyone |

---

## 13. Revisions test (PRO)

1. Enable **Code Revisions** on a snippet.  
2. Save version 1:

```html
<p id="wpps-rev-v1">Version 1</p>
```

3. Save version 2:

```html
<p id="wpps-rev-v2">Version 2</p>
```

4. Change location, schedule, or conditional rules; save version 3.  
5. Restore version 1 — all fields from v1 should return.  
6. Try restoring version with bad PHP:

```php
echo ( ;
```

**Pass:** Restore blocked with error.

---

## 14. AI assistant prompts (optional)

Use in editor **AI Assistant** panel. Nothing runs until you click **Save**.

| Task | Prompt |
|------|--------|
| Generate | `Add a dismissible yellow admin notice that says "WPPS AI test banner"` |
| Explain | (paste any snippet code) → click **Explain** |
| Fix | `echo $name` (undefined variable) → **Fix** |
| Optimize | Verbose loop code → **Optimize** |
| Security review | `eval($_GET['cmd']);` → **Security review** |
| List audit | Run **AI Security Audit** from snippet list row |

**Rate limit test:** Run 13+ AI requests within 60 seconds → expect throttle message.

---

## 15. Admin bar tracker test

Settings → **Admin bar info** ON.

Active footer snippet:

```html
<div id="wpps-test-admin-bar" class="wpps-test-marker">Admin bar tracker test</div>
```

**Pass:** Logged-in admin sees snippet listed in admin bar on frontend.  
**Safe mode:** Should not list snippets that did not run.

---

## 16. Bulk / list action smoke

Create 3 inactive HTML snippets:

```html
<p class="wpps-test-marker">Bulk test snippet</p>
```

Use list checkboxes → Activate / Deactivate / Delete.

Create 1 PHP snippet with syntax error for bulk activate skip test:

```php
echo ( ;
```

---

## 17. Quick regression bundle (minimum set)

Run these 8 snippets for a fast smoke test:

| # | Type | Location | Code summary |
|---|------|----------|--------------|
| 1 | HTML | Header | §1.2 meta marker |
| 2 | CSS | Footer | §2.1 red outline |
| 3 | JS PRO | Footer | §3.1 console log |
| 4 | PHP PRO | Run Everywhere | §4.1 footer comment |
| 5 | HTML | Shortcode | §1.10 + shortcode in page |
| 6 | HTML | Before content | §1.5 |
| 7 | PHP PRO | Frontend Conditional | §4.4 + logged-in rule |
| 8 | PHP PRO | Error test | §10.1 (then cleanup) |

---

## Cleanup

1. Bulk select all `[TEST]` snippets → Delete.  
2. Clear Error Logs if used.  
3. Disable Global Safe Mode / URL safe mode.  
4. Remove test shortcodes from page content.  
5. Delete files in `wp-content/wpps/wpps-snippets/` if no longer needed (optional; regenerated on save).

---

## Related

- Full step-by-step QA procedures: see conversation audit / manual test guide in project docs.
- Module path: `modules/code-snippet/`
- Snippet files directory: `wp-content/wpps/wpps-snippets/`
