NEXT-37776 - Move SDK plugin tests

.github/workflows/tests.yml

@@ -152,3 +152,117 @@ jobs:
         with:
           name: meteor-admin-sdk--playwright-test-results
           path: packages/admin-sdk/playwright-report/
+
+
+  tested-versions:
+    name: tested-versions
+    runs-on: ubuntu-latest
+    outputs:
+      first-version: ${{ steps.versions.outputs.first-version }}
+      latest-version: ${{ steps.versions.outputs.latest-version }}
+      lts-first-version: ${{ steps.versions.outputs.lts-first-version }}
+      lts-latest-version: ${{ steps.versions.outputs.lts-latest-version }}
+    steps:
+      - name: Generate versions
+        id: versions
+        uses: shopware/github-actions/versions@main
+
+  ats:
+    name: Acceptance tests
+    timeout-minutes: 20
+    runs-on: ubuntu-latest
+    needs:
+      - circular-dependencies
+      - unit-tests
+      - static-analysis
+      - tested-versions
+    env:
+      TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+      TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
+      TZ: Europe/Berlin
+    strategy:
+      fail-fast: false
+      matrix:
+        shopware-version:
+          # TODO: add again with next major, does not work right now because 6.5 does not support vue3
+          # - ${{ needs.tested-versions.outputs.lts-latest-version }}
+          - ${{ needs.tested-versions.outputs.first-version }}
+          - ${{ needs.tested-versions.outputs.latest-version }}
+          - trunk
+    steps:
+      - name: Setup shopware
+        uses: shopware/setup-shopware@main
+        with:
+          path: shopware/
+          install: "true"
+          installAdmin: "true"
+          installStorefront: "true"
+          shopware-version: "${{ matrix.shopware-version }}"
+          env: dev
+
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          path: meteor/
+
+      - name: Symlink plugin
+        working-directory: shopware/custom/plugins/
+        run: ln -s ../../../meteor/examples/admin-sdk-plugin TestPlugin
+
+      - name: Activate TestPlugin
+        working-directory: shopware/
+        run: |
+          bin/console plugin:refresh
+          bin/console plugin:install --activate TestPlugin
+          bin/console cache:clear
+
+      - uses: pnpm/action-setup@v3
+        with:
+          version: 9
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20"
+          cache: "pnpm"
+          cache-dependency-path: "**/pnpm-lock.yaml"
+
+      - name: Install dependencies
+        working-directory: meteor/
+        run: pnpm install --frozen-lockfile --prefer-offline
+
+      - name: Build packages
+        working-directory: meteor/
+        run: npx turbo run build
+
+      - name: Build assets
+        working-directory: shopware/
+        run: |
+          composer run build:js
+          bin/console assets:install
+
+      - name: Start webserver
+        working-directory: shopware/
+        run: symfony server:start --allow-http --no-tls --port=8000 -d
+
+      - name: Install playwright
+        working-directory: meteor/examples/admin-sdk-plugin/tests/acceptance/
+        run: |
+          pnpm install --frozen-lockfile --prefer-offline
+          npx playwright install --with-deps
+
+      - name: Run Playwrigth
+        working-directory: meteor/examples/admin-sdk-plugin/tests/acceptance/
+        run: npx playwright test --retries=2 --reporter=github --trace=on-first-retry --project chromium
+
+      - uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: ats-test-results-${{ matrix.project }}
+          path: meteor/examples/admin-sdk-plugin/tests/acceptance/test-results/
+
+      - uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: ats-report-${{ matrix.project }}
+          path: meteor/examples/admin-sdk-plugin/tests/acceptance/playwright-report/

.github/workflows/visual-tests.yml

@@ -41,7 +41,7 @@ jobs:
         run: pnpm dlx playwright install-deps
 
       - name: Install Playwright
-        run: pnpm dlx playwright@1.44.0 install
+        run: pnpm dlx playwright@1.47.2 install
 
       - name: Build storybook
         run: pnpx turbo run build:storybook --filter=@shopware-ag/meteor-component-library -- --test

examples/admin-sdk-plugin/README.md

@@ -0,0 +1,25 @@
+# Meteor Admin SDK Example Plugin
+
+This package contains an example plugin. It uses the [Meteor Admin SDK](https://github.com/shopware/meteor/tree/main/packages/admin-sdk) to extend the administration.
+
+## Prerequisites
+We assume that you have a functioning Shopware 6 setup on your local machine.
+
+## Plugin setup
+
+1. Install all meteor dependencies: `cd <meteorRoot> && pnpm install`
+2. Build all meteor packages: `cd <meteorRoot> && turbo run build`
+3. Symlink the plugin to your Shopware 6 installation: `cd <shopwareRoot>/custom/plugins && ln -s <meteorRoot>/examples/admin-sdk-plugin TestPlugin`
+4. It's important that the plugin Folder is named `TestPlugin` inside `custom/plugins`
+5. Activate the plugin : `cd <shopwareRoot> && php bin/console plugin:refresh && php bin/console plugin:install -a -c TestPlugin`
+6. Built the administration Javascript: `cd <shopwareRoot> && composer run build:js:admin`
+
+Now you should see the plugin installed when opening the Shopware Admin and looking in "Extensions" -> "My Extensions".
+
+## Acceptance tests
+
+1. Create a `.env` file in `<meteorRoot>/examples/admin-sdk-plugin/tests/acceptance`
+2. Specify your Shopware instance app url: `APP_URL=https://dev.local/`
+3. Run the tests: `cd <meteorRoot> && pnpm --filter @shopware-ag/meteor-admin-sdk-example-plugin run test:ats`
+
+

examples/admin-sdk-plugin/composer.json

@@ -0,0 +1,18 @@
+{
+  "name": "swag/sdk-test-plugin",
+  "description": "Meteor Admin SDK Testplugin",
+  "type": "shopware-platform-plugin",
+  "license": "MIT",
+  "autoload": {
+    "psr-4": {
+      "TestPlugin\\": "src/"
+    }
+  },
+  "extra": {
+    "shopware-plugin-class": "TestPlugin\\TestPlugin",
+    "label": {
+      "de-DE": "SDK Testplugin",
+      "en-GB": "SDK Testplugin"
+    }
+  }
+}

examples/admin-sdk-plugin/src/.gitignore

@@ -0,0 +1,2 @@
+Resources/app/administration/node_modules/
+Resources/public

examples/admin-sdk-plugin/src/Resources/app/administration/build/webpack.config.js

@@ -0,0 +1,9 @@
+module.exports = () => {
+    return {
+        resolve: {
+            alias: {
+                vue$: 'vue/dist/vue.esm-browser.js'
+            }
+        }
+    };
+};

examples/admin-sdk-plugin/src/Resources/app/administration/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport"
+          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Test plugin example</title>
+</head>
+<body>
+    <div id="app"></div>
+</body>
+</html>

examples/admin-sdk-plugin/src/Resources/app/administration/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "administration",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "MIT",
+  "dependencies": {
+    "@shopware-ag/meteor-admin-sdk": "workspace:*",
+    "@shopware-ag/meteor-component-library": "workspace:*",
+    "regenerator-runtime": "^0.14.1",
+    "vue": "3.4.21",
+    "vue-router": "4.4.5"
+  },
+  "devDependencies": {
+    "typescript": "^5.6.2"
+  }
+}

examples/admin-sdk-plugin/src/Resources/app/administration/src/base/mainCommands.ts

@@ -0,0 +1,169 @@
+import { notification, ui, context } from '@shopware-ag/meteor-admin-sdk';
+
+// location/index
+ui.componentSection.add({
+    component: 'card',
+    positionId: 'sw-product-properties__before',
+    props: {
+        title: 'Location tests',
+        subtitle: 'Testing if the location methods work correctly',
+        locationId: 'location-index',
+    },
+});
+
+ui.componentSection.add({
+    component: 'card',
+    positionId: 'sw-product-properties__after',
+    props: {
+        title: 'Card tabs tests',
+        subtitle: 'Testing if the the card tabs work correctly',
+        locationId: 'card-tabs',
+        tabs: [
+            {
+                name: 'card-tab-1',
+                label: 'Tab 1',
+                locationId: 'card-tab-1',
+            },
+            {
+                name: 'card-tab-2',
+                label: 'Tab 2',
+                locationId: 'card-tab-2',
+            },
+        ],
+    },
+});
+
+ui.componentSection.add({
+    component: 'card',
+    positionId: 'ui-tabs-product-example-tab',
+    props: {
+        title: 'Hello in the new tab',
+        locationId: 'ui-modals',
+    },
+});
+
+ui.componentSection.add({
+    component: 'card',
+    positionId: 'sw-sales-channel-detail-base-options-delete__after',
+    props: {
+        title: 'Dataset testing',
+        locationId: 'data-dataset',
+    },
+});
+
+ui.tabs('sw-product-detail').addTabItem({
+    label: 'Example',
+    componentSectionId: 'ui-tabs-product-example-tab',
+});
+
+ui.tabs('sw-custom-field-set-renderer').addTabItem({
+    label: 'Example',
+    componentSectionId: 'ui-tabs-product-example-tab',
+});
+
+ui.actionButton.add({
+    name: 'activateLanguageSubscription',
+    entity: 'product',
+    view: 'detail',
+    label: 'Activate language subscription',
+    callback: () => {
+        // context / subscribe on language changes
+        context.subscribeLanguage(({ languageId, systemLanguageId }) => {
+            notification.dispatch({
+                title: 'Language changes',
+                message: `languageId: ${languageId} <br><br> systemLanguageId: ${systemLanguageId}`,
+            });
+        });
+
+        notification.dispatch({
+            title: 'Subscriber activated',
+            message: 'The subscriber for language changes was activated',
+            variant: 'info',
+        });
+    },
+});
+
+ui.actionButton.add({
+    name: 'activateLocaleSubscription',
+    entity: 'product',
+    view: 'detail',
+    label: 'Activate locale subscription',
+    callback: () => {
+        // context / subscribe on locale changes
+        context.subscribeLocale(({ fallbackLocale, locale }) => {
+            notification.dispatch({
+                title: 'Locale changes',
+                message: `locale: ${locale} <br><br> fallbackLocale: ${fallbackLocale}`,
+            });
+        });
+
+        notification.dispatch({
+            title: 'Subscriber activated',
+            message: 'The subscriber for locale changes was activated',
+            variant: 'info',
+        });
+    },
+});
+
+ui.settings.addSettingsItem({
+    label: 'App Settings',
+    locationId: 'ui-menu-item-add-menu-item-with-searchbar',
+    icon: 'default-object-books',
+    displaySearchBar: true,
+    tab: 'plugins',
+});
+
+ui.settings.addSettingsItem({
+    label: 'Without searchbar',
+    locationId: 'ui-menu-item-add-menu-item',
+    icon: 'default-action-cloud-upload',
+    displaySearchBar: false,
+    tab: 'shop',
+});
+
+ui.actionButton.add({
+    action: 'ui-action-button',
+    entity: 'product',
+    view: 'detail',
+    label: 'Test action',
+    callback: () => {
+        // nothing
+        notification.dispatch({
+            title: 'Action button click',
+            message: 'The action button in the product detail page was clicked',
+        });
+    },
+});
+
+ui.mainModule.addMainModule({
+    heading: 'My App',
+    locationId: 'ui-main-module-add-main-module',
+    displaySearchBar: false,
+});
+
+ui.menu.addMenuItem({
+    label: 'Test item',
+    locationId: 'ui-main-module-add-main-module',
+    displaySearchBar: false,
+    parent: 'sw-order',
+});
+ui.menu.addMenuItem({
+    label: 'Test with searchbar',
+    locationId: 'ui-menu-item-add-menu-item-with-searchbar',
+    displaySearchBar: true,
+    parent: 'sw-extension',
+});
+ui.menu.addMenuItem({
+    label: 'First item',
+    locationId: 'ui-menu-item-add-menu-item-with-searchbar',
+    displaySearchBar: true,
+    parent: 'sw-extension',
+    position: 10,
+});
+// For testing the third level menu entry
+ui.menu.addMenuItem({
+    label: 'Third level',
+    locationId: 'ui-main-module-add-main-module',
+    displaySearchBar: false,
+    parent: 'sw-manufacturer',
+});