Skip to content

Commit f8a6ec4

Browse files
xmavxmav
committed
AC-107: Update Third Party library: jstree
- update jquery.jstree to the lates version - adjust user roles to work with new tree - add adjustments for ACL tree in Integration - add data-id attribute to support MFTF tests - fix available resource filtering when "all enabled" - update locators in functional tests - fix ajax tree data load - fix media gallery - fix static tests - Changed assertion for new TreeJson format
1 parent be9b1fe commit f8a6ec4

File tree

54 files changed

+10049
-5440
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

54 files changed

+10049
-5440
lines changed

‎app/code/Magento/Catalog/view/adminhtml/web/js/category-tree.js

Lines changed: 22 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -16,11 +16,10 @@ define([
1616
url: '',
1717
data: [],
1818
tree: {
19-
plugins: ['themes', 'json_data', 'ui', 'hotkeys'],
20-
themes: {
21-
theme: 'default',
22-
dots: false,
23-
icons: true
19+
core: {
20+
themes: {
21+
dots: false
22+
}
2423
}
2524
}
2625
},
@@ -33,12 +32,12 @@ define([
3332
{},
3433
options.tree,
3534
{
36-
'json_data': {
37-
ajax: {
35+
core: {
36+
data: {
3837
url: options.url,
3938
type: 'POST',
40-
success: $.proxy(function (nodes) {
41-
return this._convertDataNodes(nodes);
39+
dataFilter: $.proxy(function (data) {
40+
return this._convertDataNodes(JSON.parse(data));
4241
}, this),
4342

4443
/**
@@ -47,13 +46,11 @@ define([
4746
*/
4847
data: function (node) {
4948
return {
50-
id: $(node).data('id'),
49+
id: node.id === '#' ? null : node.id,
5150
'form_key': window.FORM_KEY
5251
};
5352
}
54-
},
55-
data: this._convertData(options.data).children,
56-
'progressive_render': true
53+
}
5754
}
5855
}
5956
);
@@ -68,9 +65,9 @@ define([
6865
* @private
6966
*/
7067
_selectNode: function (event, data) {
71-
var node = data.rslt.obj.data();
68+
var node = data.node;
7269

73-
if (!node.disabled) {
70+
if (!node.state.disabled) {
7471
window.location = window.location + '/' + node.id;
7572
} else {
7673
event.preventDefault();
@@ -85,7 +82,7 @@ define([
8582
_convertDataNodes: function (nodes) {
8683
var nodesData = [];
8784

88-
nodes.forEach(function (node) {
85+
nodes.children.forEach(function (node) {
8986
nodesData.push(this._convertData(node));
9087
}, this);
9188

@@ -104,25 +101,19 @@ define([
104101
if (!node) {
105102
return result;
106103
}
104+
// jscs:disable requireCamelCaseOrUpperCaseIdentifiers
107105
result = {
108-
data: {
109-
title: utils.unescape(node.name) + ' (' + node['product_count'] + ')'
110-
},
111-
attr: {
112-
'class': node.cls + (!!node.disabled ? ' disabled' : '') //eslint-disable-line no-extra-boolean-cast
106+
id: node.id,
107+
text: utils.unescape(node.name) + ' (' + node.product_count + ')',
108+
li_attr: {
109+
class: node.cls + (!!node.disabled ? ' disabled' : '') //eslint-disable-line no-extra-boolean-cast
113110
},
114-
metadata: {
115-
id: node.id,
116-
disabled: node.disabled
111+
state: {
112+
disabled: node.disabled,
113+
opened: !!node.children_count && node.expanded
117114
}
118115
};
119-
120-
if (node['children_count'] && !node.expanded) {
121-
result.state = 'closed';
122-
} else {
123-
result.state = 'open';
124-
}
125-
116+
// jscs:enable requireCamelCaseOrUpperCaseIdentifiers
126117
if (node.children) {
127118
result.children = [];
128119
$.each(node.children, function () {

‎app/code/Magento/Cms/Block/Adminhtml/Wysiwyg/Images/Tree.php

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -79,8 +79,8 @@ public function getTreeJson()
7979
$hasNestedDirectories = $this->hasNestedDirectories($storageRoot, $item->getFilename());
8080

8181
// if no nested directories inside dir, add 'leaf' state so that jstree hides dropdown arrow next to dir
82-
if (!$hasNestedDirectories) {
83-
$data['state'] = 'leaf';
82+
if ($hasNestedDirectories) {
83+
$data['children'] = true;
8484
}
8585

8686
$jsonArray[] = $data;

‎app/code/Magento/Cms/Test/Mftf/Section/TinyMCESection/MediaGallerySection.xml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@
3737
<element name="confirmDelete" type="button" selector=".action-primary.action-accept"/>
3838
<element name="imageBlockByName" type="block" selector="//div[@data-row='file'][contains(., '{{imageName}}')]" parameterized="true"/>
3939
<element name="insertEditImageModalWindow" type="block" selector=".mce-floatpanel.mce-window[aria-label='Insert/edit image']"/>
40-
<element name="mediaGalleryFolderTreeIconCollapsed" type="button" parameterized="true" selector="//a[text()='{{folderName}}']/parent::li[contains(@class,'jstree-closed')]/ins"/>
41-
<element name="mediaGalleryFolderTreeIconExpanded" type="button" parameterized="true" selector="//a[text()='{{folderName}}']/parent::li[contains(@class,'jstree-open')]/ins"/>
40+
<element name="mediaGalleryFolderTreeIconCollapsed" type="button" parameterized="true" selector="//li[a[text()='{{folderName}}' and @aria-expanded='false']]/i"/>
41+
<element name="mediaGalleryFolderTreeIconExpanded" type="button" parameterized="true" selector="//li[a[text()='{{folderName}}' and @aria-expanded='true']]/i"/>
4242
</section>
4343
</sections>

‎app/code/Magento/Cms/view/adminhtml/web/js/folder-tree.js

Lines changed: 55 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -17,11 +17,13 @@ define([
1717
url: '',
1818
currentPath: ['root'],
1919
tree: {
20-
'plugins': ['themes', 'json_data', 'ui', 'hotkeys'],
21-
'themes': {
22-
'theme': 'default',
23-
'dots': false,
24-
'icons': true
20+
core: {
21+
themes: {
22+
dots: false
23+
},
24+
// jscs:disable requireCamelCaseOrUpperCaseIdentifiers
25+
check_callback: true
26+
// jscs:enable requireCamelCaseOrUpperCaseIdentifiers
2527
}
2628
}
2729
},
@@ -34,41 +36,33 @@ define([
3436
{},
3537
options.tree,
3638
{
37-
'json_data': {
39+
core: {
3840
data: {
39-
data: options.rootName,
40-
state: 'closed',
41-
metadata: {
42-
node: {
43-
id: options.root,
44-
text: options.rootName
45-
}
46-
},
47-
attr: {
48-
'data-id': options.root,
49-
id: options.root
50-
}
51-
},
52-
ajax: {
5341
url: options.url,
42+
type: 'POST',
43+
dataType: 'text',
44+
dataFilter: $.proxy(function (data) {
45+
return this._convertData(JSON.parse(data));
46+
}, this),
5447

5548
/**
56-
* @param {Object} node
49+
* @param {HTMLElement} node
5750
* @return {Object}
5851
*/
5952
data: function (node) {
6053
return {
61-
node: node.data('id'),
54+
node: node.id === 'root' ? null : node.id,
6255
'form_key': window.FORM_KEY
6356
};
64-
},
65-
success: this._convertData
57+
}
6658
}
6759
}
6860
}
6961
);
7062

71-
this.element.jstree(treeOptions).on('loaded.jstree', $.proxy(this.treeLoaded, this));
63+
this.element.jstree(treeOptions)
64+
.on('ready.jstree', $.proxy(this.treeLoaded, this))
65+
.on('load_node.jstree', $.proxy(this._createRootNode, this));
7266
},
7367

7468
/**
@@ -106,25 +100,52 @@ define([
106100
recursiveOpen();
107101
},
108102

103+
/**
104+
* Create tree root node
105+
*
106+
* @param {jQuery.Event} event
107+
* @param {Object} data
108+
* @private
109+
*/
110+
_createRootNode: function (event, data) {
111+
var rootNode, children;
112+
113+
// jscs:disable requireCamelCaseOrUpperCaseIdentifiers
114+
if (data.node.id === '#') {
115+
rootNode = {
116+
id: this.options.root,
117+
text: this.options.rootName,
118+
li_attr: {
119+
'data-id': this.options.root
120+
}
121+
};
122+
children = data.node.children;
123+
124+
data.instance.element.jstree().create_node(null, rootNode, 'first', function () {
125+
data.instance.element.jstree().move_node(children, rootNode.id);
126+
});
127+
}
128+
// jscs:enable requireCamelCaseOrUpperCaseIdentifiers
129+
},
130+
109131
/**
110132
* @param {*} data
111133
* @return {*}
112134
* @private
113135
*/
114136
_convertData: function (data) {
115137
return $.map(data, function (node) {
116-
var codeCopy = $.extend({}, node);
117138

118139
return {
119-
data: node.text,
120-
attr: {
121-
'data-id': node.id,
122-
id: node.id
123-
},
124-
metadata: {
125-
node: codeCopy
140+
id: node.id,
141+
text: node.text,
142+
path: node.path,
143+
// jscs:disable requireCamelCaseOrUpperCaseIdentifiers
144+
li_attr: {
145+
'data-id': node.id
126146
},
127-
state: node.state || 'closed'
147+
// jscs:enable requireCamelCaseOrUpperCaseIdentifiers
148+
children: node.children
128149
};
129150
});
130151
}

‎app/code/Magento/Integration/Block/Adminhtml/Integration/Activate/Permissions/Tab/Webapi.php

Lines changed: 39 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -162,13 +162,38 @@ public function isEverythingAllowed()
162162
*/
163163
public function getResourcesTreeJson()
164164
{
165-
$aclResourcesTree = $this->_integrationData->mapResources($this->getAclResources());
165+
$aclResourcesTree = $this->_integrationData->mapResources(
166+
$this->getAclResources(),
167+
$this->getSelectedResources()
168+
);
166169

167-
return $this->encoder->encode($aclResourcesTree);
170+
return $this->encoder->encode($this->disableAclTreeNodes($aclResourcesTree));
168171
}
169172

170173
/**
171-
* Return an array of selected resource ids.
174+
* Mark tree nodes as disabled
175+
*
176+
* @param array $aclResourcesTree
177+
* @return array
178+
*/
179+
private function disableAclTreeNodes(array $aclResourcesTree)
180+
{
181+
$output = [];
182+
foreach ($aclResourcesTree as $node) {
183+
if (!isset($node['state']['selected']) || $node['state']['selected'] !== true) {
184+
continue;
185+
}
186+
$node['state']['disabled'] = true;
187+
if (isset($node['children'])) {
188+
$node['children'] = $this->disableAclTreeNodes($node['children']);
189+
}
190+
$output[] = $node;
191+
}
192+
return $output;
193+
}
194+
195+
/**
196+
* Return json encoded array of selected resource ids.
172197
*
173198
* If everything is allowed then iterate through all
174199
* available resources to generate a comprehensive array of all resource ids, rather than just
@@ -177,12 +202,22 @@ public function getResourcesTreeJson()
177202
* @return string
178203
*/
179204
public function getSelectedResourcesJson()
205+
{
206+
return $this->encoder->encode($this->getSelectedResources());
207+
}
208+
209+
/**
210+
* Return an array of selected resource ids.
211+
*
212+
* @return string[]
213+
*/
214+
private function getSelectedResources()
180215
{
181216
$selectedResources = $this->_selectedResources;
182217
if ($this->isEverythingAllowed()) {
183218
$selectedResources = $this->_getAllResourceIds($this->getAclResources());
184219
}
185-
return $this->encoder->encode($selectedResources);
220+
return $selectedResources;
186221
}
187222

188223
/**

‎app/code/Magento/Integration/Block/Adminhtml/Integration/Edit/Tab/Webapi.php

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,6 @@ class Webapi extends \Magento\Backend\Block\Widget\Form\Generic implements
2626
protected $rootResource;
2727

2828
/**
29-
* Acl resource provider
30-
*
3129
* @var \Magento\Framework\Acl\AclResource\ProviderInterface
3230
*/
3331
protected $aclResourceProvider;
@@ -182,7 +180,7 @@ public function isEverythingAllowed()
182180
*/
183181
public function getTree()
184182
{
185-
return $this->integrationData->mapResources($this->getAclResources());
183+
return $this->integrationData->mapResources($this->getAclResources(), $this->getSelectedResources());
186184
}
187185

188186
/**

‎app/code/Magento/Integration/Helper/Data.php

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,19 +13,22 @@ class Data extends \Magento\Framework\App\Helper\AbstractHelper
1313
* Make ACL resource array compatible with jQuery jsTree component.
1414
*
1515
* @param array $resources
16+
* @param array $selectedResources
1617
* @return array
1718
*/
18-
public function mapResources(array $resources)
19+
public function mapResources(array $resources, array $selectedResources = [])
1920
{
2021
$output = [];
2122
foreach ($resources as $resource) {
2223
$item = [];
23-
$item['attr']['data-id'] = $resource['id'];
24-
$item['data'] = __($resource['title']);
24+
$item['id'] = $resource['id'];
25+
$item['li_attr']['data-id'] = $resource['id'];
26+
$item['text'] = __($resource['title']);
2527
$item['children'] = [];
28+
$item['state']['selected'] = in_array($item['id'], $selectedResources) ?? false;
2629
if (isset($resource['children'])) {
27-
$item['state'] = 'open';
28-
$item['children'] = $this->mapResources($resource['children']);
30+
$item['state']['opened'] = true;
31+
$item['children'] = $this->mapResources($resource['children'], $selectedResources);
2932
}
3033
$output[] = $item;
3134
}

0 commit comments

Comments
 (0)