Skip to content

Commit e429f0e

Browse files
committed
MAGETWO-90177: Image broken on storefront with secure key enabled
Fix directive parsing and trailing forward slash issues
1 parent 52dc0e2 commit e429f0e

File tree

2 files changed

+68
-33
lines changed

2 files changed

+68
-33
lines changed

dev/tests/js/jasmine/tests/lib/mage/wysiwygAdapter.test.js

Lines changed: 63 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -22,41 +22,74 @@ define([
2222
Constr.prototype = wysiwygAdapter;
2323

2424
obj = new Constr();
25-
obj.initialize('id', {
26-
'directives_url': 'http://example.com/admin/cms/wysiwyg/directive/'
27-
});
2825
});
2926

3027
describe('wysiwygAdapter', function () {
31-
var decodedHtml = '<p>' +
32-
'<img src="{{media url=&quot;wysiwyg/banana.jpg&quot;}}" alt="" width="612" height="459"></p>',
33-
encodedHtml = '<p>' +
34-
'<img src="http://example.com/admin/cms/wysiwyg/directive/' +
35-
'___directive/e3ttZWRpYSB1cmw9Ind5c2l3eWcvYmFuYW5hLmpwZyJ9fQ%2C%2C" alt="" width="612" height="459">' +
36-
'</p>',
37-
encodedHtmlWithForwardSlashInImgSrc = encodedHtml.replace('%2C%2C', '%2C%2C/');
38-
39-
describe('"encodeDirectives" method', function () {
40-
it('converts media directive img src to directive URL', function () {
41-
expect(obj.encodeDirectives(decodedHtml)).toEqual(encodedHtml);
28+
describe('encoding and decoding directives', function () {
29+
function runTests(decodedHtml, encodedHtml) {
30+
var encodedHtmlWithForwardSlashInImgSrc = encodedHtml.replace('src="([^"]+)', 'src="$1/"');
31+
32+
describe('"encodeDirectives" method', function () {
33+
it('converts media directive img src to directive URL', function () {
34+
expect(obj.encodeDirectives(decodedHtml)).toEqual(encodedHtml);
35+
});
36+
});
37+
38+
describe('"decodeDirectives" method', function () {
39+
it(
40+
'converts directive URL img src without a trailing forward slash ' +
41+
'to media url without a trailing forward slash',
42+
function () {
43+
expect(obj.decodeDirectives(encodedHtml)).toEqual(decodedHtml);
44+
}
45+
);
46+
47+
it('converts directive URL img src with a trailing forward slash ' +
48+
'to media url without a trailing forward slash',
49+
function () {
50+
expect(obj.decodeDirectives(encodedHtmlWithForwardSlashInImgSrc)).toEqual(decodedHtml);
51+
}
52+
);
53+
});
54+
}
55+
56+
describe('without secret key', function () {
57+
var decodedHtml = '<p>' +
58+
'<img src="{{media url=&quot;wysiwyg/banana.jpg&quot;}}" alt="" width="612" height="459"></p>',
59+
encodedHtml = '<p>' +
60+
'<img src="http://example.com/admin/cms/wysiwyg/directive/___directive' +
61+
'/e3ttZWRpYSB1cmw9Ind5c2l3eWcvYmFuYW5hLmpwZyJ9fQ%2C%2C" alt="" width="612" height="459">' +
62+
'</p>';
63+
64+
beforeEach(function () {
65+
obj.initialize('id', {
66+
'directives_url': 'http://example.com/admin/cms/wysiwyg/directive/'
67+
});
68+
});
69+
70+
runTests(decodedHtml, encodedHtml);
4271
});
43-
});
4472

45-
describe('"decodeDirectives" method', function () {
46-
it(
47-
'converts directive URL img src without a trailing forward slash ' +
48-
'to media url without a trailing forward slash',
49-
function () {
50-
expect(obj.decodeDirectives(encodedHtml)).toEqual(decodedHtml);
51-
}
52-
);
53-
54-
it('converts directive URL img src with a trailing forward slash ' +
55-
'to media url without a trailing forward slash',
56-
function () {
57-
expect(obj.decodeDirectives(encodedHtmlWithForwardSlashInImgSrc)).toEqual(decodedHtml);
58-
}
59-
);
73+
describe('with secret key', function () {
74+
var decodedHtml = '<p>' +
75+
'<img src="{{media url=&quot;wysiwyg/banana.jpg&quot;}}" alt="" width="612" height="459"></p>',
76+
encodedHtml = '<p>' +
77+
'<img src="http://example.com/admin/cms/wysiwyg/directive/___directive' +
78+
'/e3ttZWRpYSB1cmw9Ind5c2l3eWcvYmFuYW5hLmpwZyJ9fQ%2C%2C/key/' +
79+
'5552655d13a141099d27f5d5b0c58869423fd265687167da12cad2bb39aa9a58" ' +
80+
'alt="" width="612" height="459">' +
81+
'</p>',
82+
directiveUrl = 'http://example.com/admin/cms/wysiwyg/directive/key/' +
83+
'5552655d13a141099d27f5d5b0c58869423fd265687167da12cad2bb39aa9a58/';
84+
85+
beforeEach(function () {
86+
obj.initialize('id', {
87+
'directives_url': directiveUrl
88+
});
89+
});
90+
91+
runTests(decodedHtml, encodedHtml);
92+
});
6093
});
6194
});
6295
});

lib/web/mage/adminhtml/wysiwyg/tiny_mce/tinymce4Adapter.js

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -575,7 +575,9 @@ define([
575575
* @param {String} directive
576576
*/
577577
makeDirectiveUrl: function (directive) {
578-
return this.config['directives_url'].replace(/directive.*/, 'directive/___directive/' + directive);
578+
return this.config['directives_url']
579+
.replace(/directive/, 'directive/___directive/' + directive)
580+
.replace(/\/$/, '');
579581
},
580582

581583
/**
@@ -608,9 +610,9 @@ define([
608610
decodeDirectives: function (content) {
609611
// escape special chars in directives url to use it in regular expression
610612
var url = this.makeDirectiveUrl('%directive%').replace(/([$^.?*!+:=()\[\]{}|\\])/g, '\\$1'),
611-
reg = new RegExp(url.replace('%directive%', '([a-zA-Z0-9,_-]+(?:%2[A-Z]|)+\/?)'));
613+
reg = new RegExp(url.replace('%directive%', '([a-zA-Z0-9,_-]+(?:%2[A-Z]|)+\/?)(?:(?!").)*') + '/?');
612614

613-
return content.gsub(reg, function (match) { //eslint-disable-line no-extra-bind
615+
return content.gsub(reg, function (match) {
614616
return Base64.mageDecode(decodeURIComponent(match[1]).replace(/\/$/, '')).replace(/"/g, '&quot;');
615617
});
616618
},

0 commit comments

Comments
 (0)