Browser tests

.github/workflows/dusk.yml

@@ -0,0 +1,66 @@
+name: dusk
+
+on:
+  push:
+  pull_request:
+  schedule:
+    - cron: '0 0 * * *'
+
+jobs:
+  dusk:
+    runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        include:
+          - magento-version: 2.3.6
+            magento-php-version: php73-fpm
+            rapidez-php-version: 7.4
+          - magento-version: 2.4.1
+            magento-php-version: php74-fpm
+            rapidez-php-version: 7.4
+
+    services:
+      magento:
+        image: michielgerritsen/magento-project-community-edition:${{matrix.magento-php-version}}-magento${{matrix.magento-version}}-sample-data
+        env:
+          URL: http://localhost:1234/
+          FLAT_TABLES: true
+        ports:
+          - 3307:3306
+          - 1234:80
+
+    name: P${{ matrix.rapidez-php-version }} - M${{matrix.magento-version}} on ${{matrix.magento-php-version}}
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+
+      - name: Setup PHP
+        uses: shivammathur/setup-php@v2
+        with:
+          php-version: ${{ matrix.rapidez-php-version }}
+          extensions: mbstring, dom, fileinfo, mysql
+          coverage: none
+
+      - name: Install dependencies
+        run: composer install --prefer-dist --no-interaction
+
+      - name: Prepare Laravel Dusk
+        run: composer run dusk:prepare
+
+      - name: Compile assets
+        run: composer run dusk:assets
+
+      - name: Execute tests
+        run: composer run dusk:test
+
+      - name: Upload Artifact
+        if: failure()
+        uses: actions/upload-artifact@v2
+        with:
+          name: artifact
+          path: |
+            tests/Browser/screenshots
+            tests/Browser/console
+            vendor/orchestra/testbench-dusk/laravel/storage/logs/laravel.log

.github/workflows/run-tests.yml → .github/workflows/phpunit.yml

@@ -1,4 +1,4 @@
-name: run-tests
+name: phpunit
 
 on:
   push:
@@ -7,7 +7,7 @@ on:
     - cron: '0 0 * * *'
 
 jobs:
-  run-tests:
+  phpunit:
     runs-on: ubuntu-latest
     strategy:
       fail-fast: false

.gitignore

@@ -1,3 +1,7 @@
 .phpunit.result.cache
+/node_modules
+/public
+/vendor
 composer.lock
-vendor
+phpunit.dusk.xml
+phpunit.xml

README.md

@@ -1,3 +1,16 @@
 # Rapidez Core
 
 See: https://github.com/rapidez/rapidez
+
+## Running the tests
+
+### Unit and feature tests
+
+Just run `./vendor/bin/phpunit`
+
+### Browser tests
+
+- Make sure you've a Magento install running
+- Prepare Laravel Dusk with `composer run dusk:prepare`
+- Compile the assets with: `composer run dusk:assets` and re-run this when the assets are changed
+- Tests can be started with: `composer run dusk:test`

composer.json

@@ -25,7 +25,9 @@
         "tormjens/eventy": "^0.6"
     },
     "require-dev": {
+        "laravel/dusk": "^6.9",
         "orchestra/testbench": "^6.4",
+        "orchestra/testbench-dusk": "^6.4",
         "phpunit/phpunit": "^9.4"
     },
     "autoload": {
@@ -47,5 +49,17 @@
                 "Rapidez\\Core\\RapidezServiceProvider"
             ]
         }
+    },
+    "scripts": {
+        "dusk:prepare": [
+            "./vendor/bin/dusk-updater detect --auto-update",
+            "@php -r \"file_exists('phpunit.dusk.xml') || copy('phpunit.dusk.xml.dist', 'phpunit.dusk.xml'); \""
+        ],
+        "dusk:assets": [
+            "yarn install --frozen-lockfile",
+            "yarn run prod",
+            "cp -r public/. vendor/orchestra/testbench-dusk/laravel/public/"
+        ],
+        "dusk:test": ["./vendor/bin/phpunit -c phpunit.dusk.xml --colors=always"]
     }
 }

package.json

@@ -0,0 +1,32 @@
+{
+    "private": true,
+    "scripts": {
+        "dev": "npm run development",
+        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
+        "watch": "npm run development -- --watch",
+        "watch-poll": "npm run watch -- --watch-poll",
+        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
+        "prod": "npm run production",
+        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
+    },
+    "devDependencies": {
+        "@appbaseio/reactivesearch-vue": "^1.7.7",
+        "@tailwindcss/ui": "^0.6.2",
+        "autoprefixer": "^10.0.1",
+        "axios": "^0.19",
+        "cross-env": "^7.0",
+        "laravel-mix": "^5.0.1",
+        "lodash": "^4.17.13",
+        "postcss-import": "^13.0.0",
+        "postcss-nested": "^5.0.1",
+        "resolve-url-loader": "^2.3.1",
+        "sass": "^1.20.1",
+        "sass-loader": "^8.0.0",
+        "tailwindcss": "^1.9.5",
+        "turbolinks": "^5.2.0",
+        "vue": "^2.6.12",
+        "vue-async-computed": "^3.8.2",
+        "vue-template-compiler": "^2.6.12",
+        "vue-turbolinks": "^2.1.0"
+    }
+}

phpunit.dusk.xml.dist

@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<phpunit backupGlobals="false"
+         backupStaticAttributes="false"
+         bootstrap="tests/bootstrap.php"
+         colors="true"
+         convertErrorsToExceptions="true"
+         convertNoticesToExceptions="true"
+         convertWarningsToExceptions="true"
+         processIsolation="false"
+         stopOnFailure="false"
+         verbose="true"
+>
+    <testsuites>
+        <testsuite name="Browser">
+            <directory suffix="Test.php">./tests/Browser</directory>
+        </testsuite>
+    </testsuites>
+    <coverage>
+        <include>
+            <directory suffix=".php">./src</directory>
+        </include>
+    </coverage>
+    <php>
+        <env name="MAGENTO_URL" value="http://localhost:1234"/>
+        <env name="APP_ENV" value="testing"/>
+        <env name="APP_KEY" value="AckfSECXIvnK5r28GVIWUAxmbBSjTsmF"/>
+        <env name="APP_DEBUG" value="true"/>
+        <env name="DB_HOST" value="127.0.0.1"/>
+        <env name="DB_PORT" value="3307"/>
+        <env name="DB_DATABASE" value="magento"/>
+        <env name="DB_USERNAME" value="magento"/>
+        <env name="DB_PASSWORD" value="password"/>
+    </php>
+</phpunit>

phpunit.xml → phpunit.xml.dist

@@ -11,8 +11,11 @@
          verbose="true"
 >
     <testsuites>
-        <testsuite name="Tests">
-            <directory>tests</directory>
+        <testsuite name="Feature">
+            <directory suffix="Test.php">./tests/Feature</directory>
+        </testsuite>
+        <testsuite name="Unit">
+            <directory suffix="Test.php">./tests/Unit</directory>
         </testsuite>
     </testsuites>
     <coverage>
@@ -21,11 +24,11 @@
         </include>
     </coverage>
     <php>
-        <server name="APP_ENV" value="testing"/>
-        <server name="DB_HOST" value="127.0.0.1"/>
-        <server name="DB_PORT" value="3307"/>
-        <server name="DB_DATABASE" value="magento-test"/>
-        <server name="DB_USERNAME" value="magento"/>
-        <server name="DB_PASSWORD" value="password"/>
+        <env name="APP_ENV" value="testing"/>
+        <env name="DB_HOST" value="127.0.0.1"/>
+        <env name="DB_PORT" value="3307"/>
+        <env name="DB_DATABASE" value="magento-test"/>
+        <env name="DB_USERNAME" value="magento"/>
+        <env name="DB_PASSWORD" value="password"/>
     </php>
 </phpunit>

resources/js/app.js

@@ -0,0 +1,92 @@
+window._ = require('lodash')
+window.axios = require('axios')
+window.Vue = require('vue')
+
+window.Turbolinks = require('turbolinks')
+Turbolinks.start()
+import TurbolinksAdapter from 'vue-turbolinks'
+Vue.use(TurbolinksAdapter)
+
+import ReactiveSearch from '@appbaseio/reactivesearch-vue'
+Vue.use(ReactiveSearch)
+
+import AsyncComputed from 'vue-async-computed'
+Vue.use(AsyncComputed)
+
+require('@/axios')
+require('@/filters')
+require('@/mixins')
+require('@/turbolinks')
+
+/**
+ * The following block of code may be used to automatically register your
+ * Vue components. It will recursively scan this directory for the Vue
+ * components and automatically register them with their "basename".
+ *
+ * Eg. ./components/ExampleComponent.vue -> <example-component></example-component>
+ */
+
+const files = require.context('./', true, /\.vue$/i)
+files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default))
+
+Vue.component('cart', require('@/components/Cart/Cart.vue').default)
+Vue.component('category', require('@/components/Category/Category.vue').default)
+Vue.component('category-filter', require('@/components/Category/Filters/CategoryFilter.vue').default)
+Vue.component('swatch-filter', require('@/components/Category/Filters/SwatchFilter.vue').default)
+Vue.component('checkout', require('@/components/Checkout/Checkout.vue').default)
+Vue.component('login', require('@/components/Checkout/Login.vue').default)
+Vue.component('coupon', require('@/components/Coupon/Coupon.vue').default)
+Vue.component('toggler', require('@/components/Elements/Toggler.vue').default)
+Vue.component('add-to-cart', require('@/components/Product/AddToCart.vue').default)
+Vue.component('user', require('@/components/User/User.vue').default)
+
+try {
+    Vue.component('product-compare-widget', require('Vendor/rapidez/compare/src/components/Widget.vue').default)
+    Vue.component('product-compare-checkbox', require('Vendor/rapidez/compare/src/components/Checkbox.vue').default)
+    Vue.component('product-compare-overview', require('Vendor/rapidez/compare/src/components/Overview.vue').default)
+} catch (e) {}
+
+/**
+ * Next, we will create a fresh Vue application instance and attach it to
+ * the page. Then, you may begin adding components to this application
+ * or customize the JavaScript scaffolding to fit your unique needs.
+ */
+
+document.addEventListener('turbolinks:load', () => {
+    Vue.prototype.config = window.config
+    window.app = new Vue({
+        el: '#app',
+        data: {
+            config: window.config,
+            loading: false,
+            guestEmail: null,
+            user: null,
+            cart: null,
+            checkout: {
+                step: 1,
+                shipping_address: {
+                    'firstname': process.env.MIX_DEBUG ? 'Roy' : null,
+                    'lastname': process.env.MIX_DEBUG ? 'Duineveld' : null,
+                    'zipcode': process.env.MIX_DEBUG ? '1823CW' : null,
+                    'housenumber': process.env.MIX_DEBUG ? 7 : null,
+                    'street': process.env.MIX_DEBUG ? 'Pettemerstraat' : null,
+                    'city': process.env.MIX_DEBUG ? 'Alkmaar' : null,
+                    'telephone': process.env.MIX_DEBUG ? '0727100094' : null,
+                },
+                billing_address: {},
+
+                shipping_method: null,
+                shipping_methods: [],
+
+                payment_method: null,
+                payment_methods: [],
+
+                // This can be used to prevent the checkout from going
+                // to the next step which is useful in combination
+                // with the "CheckoutPaymentSaved" event to
+                // implement payment providers.
+                doNotGoToTheNextStep: false,
+            }
+        },
+    })
+})

resources/views/layouts/partials/header.blade.php

@@ -17,6 +17,7 @@
         @include('rapidez::layouts.partials.header.minicart')
     </div>
     <div class="w-full">
-        <x-menu/>
+        {{-- Because the lack of an @includeIf or @includeWhen equivalent for Blade components we're using a placeholder --}}
+        <x-dynamic-component :component="App::providerIsLoaded('Rapidez\Menu\MenuServiceProvider') ? 'menu' : 'placeholder'" />
     </div>
 </div>

src/Commands/IndexProductsCommand.php

@@ -15,7 +15,7 @@
 
 class IndexProductsCommand extends Command
 {
-    protected $signature = 'index:products {--fresh : Recreate the indexes}';
+    protected $signature = 'rapidez:index {--fresh : Recreate the indexes}';
 
     protected $description = 'Index the products in Elasticsearch';
 

src/Commands/InstallCommand.php

@@ -0,0 +1,22 @@
+<?php
+
+namespace Rapidez\Core\Commands;
+
+use Illuminate\Console\Command;
+
+class InstallCommand extends Command
+{
+    protected $signature = 'rapidez:install';
+
+    protected $description = 'Install Rapidez';
+
+    public function handle()
+    {
+        copy(__DIR__.'/../../webpack.mix.js', base_path('webpack.mix.js'));
+        copy(__DIR__.'/../../package.json', base_path('package.json'));
+        copy(__DIR__.'/../../yarn.lock', base_path('yarn.lock'));
+        copy(__DIR__.'/../../tailwind.config.js', base_path('tailwind.config.js'));
+
+        $this->info('Done 🚀');
+    }
+}