SCEditor icon indicating copy to clipboard operation
SCEditor copied to clipboard

The html --> bbcode conversion filter by class does not work correctly

Open MioVisman opened this issue 5 months ago • 0 comments

I added a new bbcode to bbcode.js:

var bbcodeHandlers = {
...
		// START_COMMAND: Hide
		hide: {
			tags: {
				div: {
					class: 'f-bb-hide'
				}
			},
			isInline: false,
			format: function (element, content) {
				var type = attr(element, 'data-bb');

				if (/^(?:admin|mod|[1-9]\d{0,8})$/.test(type)) {
					type = '=' + type;
				} else {
					type = '';
				}

				return '[hide' + type + ']' + content + '[/hide]';
			},
			html: function (token, attrs, content) {
				var type = 'guest';

				if (attrs.defaultattr && /^(?:admin|mod|[1-9]\d{0,8})$/.test(attrs.defaultattr)) {
					type = escapeEntities(attrs.defaultattr);
				}

				return '<div class="f-bb-hide f-bb-hide-visible" data-bb="' + type + '">' + content + '</div>';
			}
		},
		// END_COMMAND

...
}

And yesterday I was racking my brains all evening "Why does this visual bbcode refuse to turn into [ hide ... ] ... [ /hide ]? What did I forget to do?"

Probable cause: Incorrect handling of class matches in createAttributeMatch(). Original version:

			function createAttributeMatch(isStrict) {
				return function (attribute) {
					var name = attribute[0];
					var value = attribute[1];

					// code tags should skip most styles
					if (name === 'style' && element.nodeName === 'CODE') {
						return false;
					}

					if (name === 'style' && value) {
						return value[isStrict ? 'every' : 'some'](isStyleMatch);
					} else {
						var val = attr(element, name);

						return val && (!value || value.includes(val));
					}
				};
			}

My variant:

			function createAttributeMatch(isStrict) {
				return function (attribute) {
					var name = attribute[0];
					var value = attribute[1];

					// code tags should skip most styles
					if (name === 'style' && element.nodeName === 'CODE') {
						return false;
					}

					if (name === 'style' && value) {
						return value[isStrict ? 'every' : 'some'](isStyleMatch);
					} else {
						var val = attr(element, name);

						// Visman - фикс обработки поиска класса
						if (name === 'class' && val) {
							val = val.split(/\s+/);

							if (typeof value === 'string') {
								value = [value];
							}

							return value.some(function (cur) {return val.includes(cur);})
						}

						return val && (!value || value.includes(val));
					}
				};
			}

MioVisman avatar May 17 '25 09:05 MioVisman