SSR

.eslintrc.cjs

@@ -12,5 +12,8 @@ module.exports = {
         "vue/require-default-prop": 0,
         "indent": ["error", 4],
         "quotes": ["error", "double"],
+        "object-curly-spacing": ["error", "always"],
+        "semi": ["error", "always"],
+        "comma-spacing": ["error", { "before": false, "after": true }]
     }
-}
+};

.github/workflows/run-tests.yml

@@ -10,9 +10,10 @@ jobs:
       matrix:
         php: [8.1, 8.0]
         laravel: [9.*]
+        ssr: [true, false]
         dependency-version: [prefer-lowest, prefer-stable]
 
-    name: P${{ matrix.php }} - ${{ matrix.dependency-version }}
+    name: Test P${{ matrix.php }} - L${{ matrix.laravel }} - SSR ${{ matrix.ssr }} - ${{ matrix.dependency-version }}
 
     steps:
       - name: Checkout code
@@ -75,12 +76,24 @@ jobs:
           cd app
           php artisan websockets:serve &
 
+      - name: Start SSR server
+        run: |
+          cd app
+          sed -i -e "s|SPLADE_SSR_ENABLED=false|SPLADE_SSR_ENABLED=true|g" .env
+          node bootstrap/ssr/ssr.js &
+        if: matrix.ssr == true
+
       - name: Run Laravel Server
         run: |
           cd app
           php artisan serve &
 
-      - name: Execute tests
+      - name: Execute Feature/Unit tests
+        run: |
+          cd app
+          php artisan test
+
+      - name: Execute Dusk tests
         run: |
           cd app
           php artisan dusk
@@ -112,3 +125,56 @@ jobs:
         with:
           name: logs
           path: app/storage/logs
+
+  stub-tests:
+    runs-on: ubuntu-latest
+
+    strategy:
+      fail-fast: true
+      matrix:
+        php: [8.1, 8.0]
+        laravel: [9.*]
+        dependency-version: [prefer-lowest, prefer-stable]
+
+    name: Test Stubs P${{ matrix.php }} - L${{ matrix.laravel }} - ${{ matrix.dependency-version }}
+
+    steps:
+      - name: Setup PHP
+        uses: shivammathur/setup-php@v2
+        with:
+          php-version: ${{ matrix.php }}
+          extensions: dom, curl, libxml, mbstring, zip, pcntl, pdo, sqlite, pdo_sqlite, bcmath, soap, intl, gd, exif, iconv, imagick, mysql, mysqli, pdo_mysql
+          coverage: none
+
+      - name: Setup Laravel
+        run: |
+          composer create-project laravel/laravel:^9 .
+          composer require protonemedia/laravel-splade
+          rm -rf vendor/protonemedia/laravel-splade
+
+      - name: Checkout code
+        uses: actions/checkout@v2
+        with:
+          path: "vendor/protonemedia/laravel-splade"
+
+      - name: Install Splade
+        run: |
+          composer dump
+          php artisan splade:install
+
+      - name: Install NPM dependencies
+        run: |
+          npm i
+          rm -rf node_modules/@protonemedia/laravel-splade/dist
+          cp -R vendor/protonemedia/laravel-splade/dist node_modules/@protonemedia/laravel-splade/
+
+      - name: Compile assets
+        run: npm run build
+
+      - name: Start SSR server
+        run: |
+          echo "SPLADE_SSR_ENABLED=true" >> .env
+          node bootstrap/ssr/ssr.mjs &
+
+      - name: Run Test command
+        run: php artisan splade:ssr-test

.gitignore

@@ -11,3 +11,4 @@ testbench.yaml
 vendor
 node_modules
 protonemedia-laravel-splade-*.tgz
+app/bootstrap/ssr*

app/.env.example

@@ -45,3 +45,5 @@ VITE_PUSHER_PORT="${PUSHER_PORT}"
 VITE_PUSHER_SCHEME="${PUSHER_SCHEME}"
 VITE_PUSHER_HOST="${PUSHER_HOST}"
 VITE_PUSHER_APP_CLUSTER="${PUSHER_APP_CLUSTER}"
+
+SPLADE_SSR_ENABLED=false

app/package.json

@@ -2,9 +2,10 @@
     "private": true,
     "scripts": {
         "dev": "vite",
-        "build": "vite build"
+        "build": "vite build && vite build --ssr"
     },
     "devDependencies": {
+        "@protonemedia/laravel-splade": "file:../protonemedia-laravel-splade-0.1.2.tgz",
         "@tailwindcss/forms": "^0.5.2",
         "@tailwindcss/typography": "^0.5.2",
         "@vitejs/plugin-vue": "^2.3.3",
@@ -17,7 +18,6 @@
         "pusher-js": "^7.2.0",
         "tailwindcss": "^3.1.0",
         "vite": "^2.9.11",
-        "vue": "^3.2.37",
-        "@protonemedia/laravel-splade": "file:../protonemedia-laravel-splade-0.1.2.tgz"
+        "vue": "^3.2.37"
     }
 }

app/phpunit.xml.dist

@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<phpunit xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="./vendor/phpunit/phpunit/phpunit.xsd" bootstrap="vendor/autoload.php" colors="true">
+    <testsuites>
+        <testsuite name="Unit">
+            <directory suffix="Test.php">./tests/Unit</directory>
+        </testsuite>
+        <testsuite name="Feature">
+            <directory suffix="Test.php">./tests/Feature</directory>
+        </testsuite>
+    </testsuites>
+    <coverage processUncoveredFiles="true">
+        <include>
+            <directory suffix=".php">./app</directory>
+        </include>
+    </coverage>
+    <php>
+        <env name="APP_ENV" value="testing"/>
+        <env name="BCRYPT_ROUNDS" value="4"/>
+        <env name="CACHE_DRIVER" value="array"/>
+        <env name="DB_CONNECTION" value="sqlite"/>
+        <env name="MAIL_MAILER" value="array"/>
+        <env name="QUEUE_CONNECTION" value="sync"/>
+        <env name="SESSION_DRIVER" value="array"/>
+        <env name="TELESCOPE_ENABLED" value="false"/>
+    </php>
+</phpunit>

app/resources/js/app.js

@@ -1,21 +1,21 @@
-import './bootstrap';
-import '../css/app.css';
+import "./bootstrap";
+import "../css/app.css";
 
-import { createApp } from 'vue'
+import { createApp } from "vue";
 
 // for dev
-// import { renderSpladeApp, SpladePlugin } from '../../../dist/protone-media-laravel-splade'
+// import { renderSpladeApp, SpladePlugin } from "../../../dist/protone-media-laravel-splade";
 
 // for build
-import { renderSpladeApp, SpladePlugin } from '@protonemedia/laravel-splade'
+import { renderSpladeApp, SpladePlugin } from "@protonemedia/laravel-splade";
 
-const el = document.getElementById('app')
+const el = document.getElementById("app");
 
 createApp({
     render: renderSpladeApp({ el })
 })
     .use(SpladePlugin, {
-        'max_keep_alive': 10,
-        'transform_anchors': false,
+        "max_keep_alive": 10,
+        "transform_anchors": false,
     })
     .mount(el);