Skip to content

Commit 9f6266e

Browse files
adjust webpack.config.js to trix as a optional wysiwyg editor
1 parent a690929 commit 9f6266e

14 files changed

Lines changed: 88 additions & 256 deletions

File tree

Lines changed: 10 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,20 @@
1-
@managing_trix_wysiwyg
2-
Feature: Managing dynamic content on store pages
3-
In order to present and manage dynamic content on my store pages
1+
@wysiwyg @managing_blocks
2+
Feature: Managing dynamic content on block page
43
As an Administrator
54
I want to be able to use the Trix WYSIWYG editor
65

76
Background:
87
Given I am logged in as an administrator
98
And the store operates on a single channel in "United States"
109

11-
@managing_blocks @ui @javascript
10+
@ui @javascript
1211
Scenario: Adding block
1312
When I go to the create block page
1413
Then I should see the Trix WYSIWYG editor initialized
15-
#
16-
# @managing_sections @ui @javascript
17-
# Scenario: Adding section
18-
# When I go to the create section page
19-
# Then I should see the Trix WYSIWYG editor initialized
20-
#
21-
# @managing_pages @ui @javascript
22-
# Scenario: Adding page
23-
# When I go to the create page page
24-
# Then I should see the Trix WYSIWYG editor initialized
25-
#
26-
# @managing_media @ui @javascript
27-
# Scenario: Adding media
28-
# When I go to the create media page
29-
# Then I should see the Trix WYSIWYG editor initialized
14+
15+
@ui @javascript
16+
Scenario: Updating block
17+
Given there is a block with "content" code and "<p>Content !</p>" content
18+
When I go to the update "content" block page
19+
Then I should see the Trix WYSIWYG editor initialized
20+
Lines changed: 4 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
@managing_blocks
2-
Feature: Managing dynamic content on block page
1+
@wysiwyg @managing_media
2+
Feature: Managing dynamic content on media page
33
As an Administrator
44
I want to be able to use the Trix WYSIWYG editor
55

@@ -8,13 +8,6 @@ Feature: Managing dynamic content on block page
88
And the store operates on a single channel in "United States"
99

1010
@ui @javascript
11-
Scenario: Adding block
12-
When I go to the create block page
11+
Scenario: Adding media
12+
When I go to the create media page
1313
Then I should see the Trix WYSIWYG editor initialized
14-
15-
@ui @javascript
16-
Scenario: Updating block
17-
Given there is a block with "content" code and "<p>Content !</p>" content
18-
When I go to the update "content" block page
19-
Then I should see the Trix WYSIWYG editor initialized
20-
Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
@managing_blocks
1+
@wysiwyg @managing_pages
22
Feature: Managing dynamic content on block page
33
As an Administrator
44
I want to be able to use the Trix WYSIWYG editor
@@ -8,13 +8,13 @@ Feature: Managing dynamic content on block page
88
And the store operates on a single channel in "United States"
99

1010
@ui @javascript
11-
Scenario: Adding block
12-
When I go to the create block page
11+
Scenario: Adding page
12+
When I go to the create page page
1313
Then I should see the Trix WYSIWYG editor initialized
1414

1515
@ui @javascript
16-
Scenario: Updating block
17-
Given there is a block with "content" code and "<p>Content !</p>" content
18-
When I go to the update "content" block page
16+
Scenario: Updating page
17+
Given there is an existing page with "test_page" code
18+
When I go to the update "test_page" page page
1919
Then I should see the Trix WYSIWYG editor initialized
2020

src/Resources/assets/admin/js/bitbag/bitbag-trix-editor.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
document.addEventListener('DOMContentLoaded', async () => {
22
if (document.querySelector('trix-editor')) {
33
try {
4-
await import('trix');
4+
await import ('trix');
55
import('trix/dist/trix.css');
66
} catch (error) {
77
console.error('Error loading Trix: ', error);

tests/Application/config/packages/bitbag_sylius_cms_plugin.yaml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ parameters:
77

88
# Switch WYSIWYG editor to Trix if you want to use it.
99
# (Default is CKEditor)
10-
#bit_bag_sylius_cms:
11-
# wysiwyg_editor: trix
10+
bit_bag_sylius_cms:
11+
wysiwyg_editor: trix
1212

1313
sylius_fixtures:
1414
suites:

tests/Application/config/packages/twig.yaml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ twig:
55
form_themes:
66
- '@FOSCKEditor/Form/ckeditor_widget.html.twig'
77
- '@BitBagSyliusCmsPlugin/Form/ckeditor_widget.html.twig'
8+
- '@BitBagSyliusCmsPlugin/Widget/_trixWidget.html.twig'
89

910
services:
1011
_defaults:

tests/Application/package.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,5 +9,8 @@
99
},
1010
"devDependencies": {
1111
"@sylius-ui/frontend": "^1.0"
12+
},
13+
"dependencies": {
14+
"trix": "^2.1.12"
1215
}
1316
}

tests/Application/webpack.config.js

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
const path = require('path');
22
const Encore = require('@symfony/webpack-encore');
3-
const [bitbagCmsShop, bitbagCmsAdmin] = require('../../webpack.config.js')
4-
3+
const createCmsConfigs = require('../../webpack.config.js')
54
const syliusBundles = path.resolve(__dirname, '../../vendor/sylius/sylius/src/Sylius/Bundle/');
65
const uiBundleScripts = path.resolve(syliusBundles, 'UiBundle/Resources/private/js/');
76
const uiBundleResources = path.resolve(syliusBundles, 'UiBundle/Resources/private/');
@@ -45,4 +44,8 @@ adminConfig.resolve.alias['sylius/bundle'] = syliusBundles;
4544
adminConfig.externals = Object.assign({}, adminConfig.externals, { window: 'window', document: 'document' });
4645
adminConfig.name = 'admin';
4746

48-
module.exports = [shopConfig, adminConfig, bitbagCmsShop, bitbagCmsAdmin];
47+
const [bitbagCmsShop, bitbagCmsAdmin] = createCmsConfigs({
48+
wysiwyg: 'trix' // 'ckeditor' | 'trix'
49+
});
50+
51+
module.exports = [shopConfig, adminConfig, bitbagCmsShop, bitbagCmsAdmin];

tests/Behat/Context/Ui/Admin/TrixWysiwygContext.php

Lines changed: 8 additions & 195 deletions
Original file line numberDiff line numberDiff line change
@@ -11,208 +11,21 @@
1111
namespace Tests\BitBag\SyliusCmsPlugin\Behat\Context\Ui\Admin;
1212

1313
use Behat\Behat\Context\Context;
14-
use FriendsOfBehat\PageObjectExtension\Page\SymfonyPageInterface;
15-
use Sylius\Behat\NotificationType;
16-
use Sylius\Behat\Service\NotificationCheckerInterface;
17-
use Sylius\Behat\Service\Resolver\CurrentPageResolverInterface;
18-
use Sylius\Behat\Service\SharedStorageInterface;
19-
use Tests\BitBag\SyliusCmsPlugin\Behat\Page\Admin\Section\CreatePageInterface;
20-
use Tests\BitBag\SyliusCmsPlugin\Behat\Page\Admin\Section\IndexPageInterface;
21-
use Tests\BitBag\SyliusCmsPlugin\Behat\Page\Admin\Section\UpdatePageInterface;
22-
use Tests\BitBag\SyliusCmsPlugin\Behat\Service\RandomStringGeneratorInterface;
23-
use Webmozart\Assert\Assert;
14+
use Behat\Mink\Element\DocumentElement;
15+
use Behat\MinkExtension\Context\RawMinkContext;
2416

25-
final class SectionContext implements Context
17+
final class TrixWysiwygContext extends RawMinkContext implements Context
2618
{
27-
public function __construct(
28-
private SharedStorageInterface $sharedStorage,
29-
private CurrentPageResolverInterface $currentPageResolver,
30-
private NotificationCheckerInterface $notificationChecker,
31-
private IndexPageInterface $indexPage,
32-
private CreatePageInterface $createPage,
33-
private UpdatePageInterface $updatePage,
34-
private RandomStringGeneratorInterface $randomStringGenerator,
35-
) {
36-
}
37-
38-
/**
39-
* @When I go to the sections page
40-
*/
41-
public function iGoToTheSectionsPage(): void
42-
{
43-
$this->indexPage->open();
44-
}
45-
46-
/**
47-
* @When I go to the create section page
48-
*/
49-
public function iGoToTheCreateSectionPage(): void
50-
{
51-
$this->createPage->open();
52-
}
53-
5419
/**
55-
* @When I delete this section
20+
* @Then I should see the Trix WYSIWYG editor initialized
5621
*/
57-
public function iDeleteThisSection(): void
22+
public function iShouldSeeTheTrixWysiwygEditorInitialized(): void
5823
{
59-
$section = $this->sharedStorage->get('section');
60-
61-
$this->indexPage->deleteSection($section->getCode());
24+
$this->getPage()->find('css', 'trix-toolbar')->setValue('test');
6225
}
6326

64-
/**
65-
* @When I want to edit this section
66-
*/
67-
public function iWantToEditThisSection(): void
68-
{
69-
$section = $this->sharedStorage->get('section');
70-
71-
$this->updatePage->open(['id' => $section->getId()]);
72-
}
73-
74-
/**
75-
* @When I fill the code with :code
76-
*/
77-
public function iFillTheCodeWith(string $code): void
78-
{
79-
$this->resolveCurrentPage()->fillCode($code);
80-
}
81-
82-
/**
83-
* @When I fill the name with :name
84-
*/
85-
public function iFillTheNameWith(string $name): void
86-
{
87-
$this->resolveCurrentPage()->fillName($name);
88-
}
89-
90-
/**
91-
* @When I add it
92-
* @When I try to add it
93-
*/
94-
public function iAddIt(): void
95-
{
96-
$this->createPage->create();
97-
}
98-
99-
/**
100-
* @When /^I fill "([^"]*)" fields with (\d+) (?:character|characters)$/
101-
*/
102-
public function iFillFieldsWithCharacters(string $fields, int $length): void
103-
{
104-
$fields = explode(',', $fields);
105-
106-
foreach ($fields as $field) {
107-
$this->resolveCurrentPage()->fillField(trim($field), $this->randomStringGenerator->generate($length));
108-
sleep(5);
109-
}
110-
}
111-
112-
/**
113-
* @Then I should be notified that :fields fields cannot be blank
114-
*/
115-
public function iShouldBeNotifiedThatFieldsCannotBeBlank(string $fields): void
116-
{
117-
$fields = explode(',', $fields);
118-
119-
foreach ($fields as $field) {
120-
Assert::true($this->resolveCurrentPage()->containsErrorWithMessage(sprintf(
121-
'%s cannot be blank.',
122-
trim($field),
123-
)));
124-
}
125-
}
126-
127-
/**
128-
* @Then I should be notified that :fields fields are too short
129-
*/
130-
public function iShouldBeNotifiedThatFieldsAreTooShort(string $fields): void
131-
{
132-
$fields = explode(',', $fields);
133-
134-
foreach ($fields as $field) {
135-
Assert::true($this->resolveCurrentPage()->containsErrorWithMessage(sprintf(
136-
'%s must be at least %d characters long.',
137-
trim($field),
138-
2,
139-
)));
140-
}
141-
}
142-
143-
/**
144-
* @Then I should be notified that :fields fields are too long
145-
*/
146-
public function iShouldBeNotifiedThatFieldsAreTooLong(string $fields): void
147-
{
148-
$fields = explode(',', $fields);
149-
150-
foreach ($fields as $field) {
151-
Assert::true($this->resolveCurrentPage()->containsErrorWithMessage(sprintf(
152-
'%s can not be longer than',
153-
trim($field),
154-
), false));
155-
}
156-
}
157-
158-
/**
159-
* @Then I should be notified that there is already an existing section with provided code
160-
*/
161-
public function iShouldBeNotifiedThatThereIsAlreadyAnExistingSectionWithCode(): void
162-
{
163-
Assert::true($this->resolveCurrentPage()->containsErrorWithMessage(
164-
'There is an existing section with this code.',
165-
false,
166-
));
167-
}
168-
169-
/**
170-
* @Then I should be notified that new section has been created
171-
*/
172-
public function iShouldBeNotifiedThatNewSectionHasBeenCreated(): void
173-
{
174-
$this->notificationChecker->checkNotification(
175-
'Section has been successfully created.',
176-
NotificationType::success(),
177-
);
178-
}
179-
180-
/**
181-
* @Then I should be notified that the section has been deleted
182-
*/
183-
public function iShouldBeNotifiedThatTheSectionHasBeenDeleted(): void
184-
{
185-
$this->notificationChecker->checkNotification(
186-
'Section has been successfully deleted.',
187-
NotificationType::success(),
188-
);
189-
}
190-
191-
/**
192-
* @Then the code field should be disabled
193-
*/
194-
public function theCodeFieldShouldBeDisabled(): void
195-
{
196-
Assert::true($this->resolveCurrentPage()->isCodeDisabled());
197-
}
198-
199-
/**
200-
* @Then I should see empty list of sections
201-
*/
202-
public function iShouldSeeEmptyListOfSections(): void
203-
{
204-
$this->resolveCurrentPage()->isEmpty();
205-
}
206-
207-
/**
208-
* @return IndexPageInterface|CreatePageInterface|UpdatePageInterface|SymfonyPageInterface
209-
*/
210-
private function resolveCurrentPage(): SymfonyPageInterface
27+
private function getPage(): DocumentElement
21128
{
212-
return $this->currentPageResolver->getCurrentPageWithForm([
213-
$this->indexPage,
214-
$this->createPage,
215-
$this->updatePage,
216-
]);
29+
return $this->getSession()->getPage();
21730
}
21831
}

tests/Behat/Resources/services/contexts/ui.xml

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,5 +73,10 @@
7373
<argument type="service" id="bitbag_sylius_cms_plugin.repository.media"/>
7474
<argument type="service" id="bitbag_sylius_cms_plugin.behat.page.shop.home"/>
7575
</service>
76+
77+
<service id="bitbag_sylius_cms_plugin.behat.context.ui.admin.trix_wysiwyg"
78+
class="Tests\BitBag\SyliusCmsPlugin\Behat\Context\Ui\Admin\TrixWysiwygContext"
79+
>
80+
</service>
7681
</services>
7782
</container>

0 commit comments

Comments
 (0)