Some Eclipse Foundation services are deprecated, or will be soon. Please ensure you've read this important communication.

Bug 424758

Summary: orion.edit.outliner service does not support multiple CSS classes
Product: [ECD] Orion Reporter: Andrew Eisenberg <andrew.eisenberg>
Component: EditorAssignee: Mark Macdonald <mamacdon>
Status: RESOLVED FIXED QA Contact:
Severity: normal    
Priority: P3 CC: curtis.windatt.public, mamacdon
Version: unspecified   
Target Milestone: 5.0 M2   
Hardware: PC   
OS: Mac OS X   
Whiteboard:

Description Andrew Eisenberg CLA 2013-12-30 14:44:20 EST 
The docs for orion.edit.outliner http://wiki.eclipse.org/Orion/Documentation/Developer_Guide/Plugging_into_the_editor#orion.edit.outliner say that this service supports a space separated list of CSS class names for styling.  However, when I add more than one css class name, I get a DOM exception: "The string contains invalid characters."

This implies that the entire string is being added as a single class name, rather than being split up and having each class name added individually.

I only have the minified source checked out right now, but the `getCellElement` method in built-edit.js seems to corroborate this assumption.
Comment 1 Andrew Eisenberg CLA 2013-12-30 14:46:20 EST 
Here is the plugin I am using:

<!DOCTYPE html>
<html>
<head>
<title>Foo bar List</title>
<script type="text/javascript" src="http://orion.eclipse.org/orion/plugin.js"></script>
<script type="text/javascript" src="http://orion.eclipse.org/requirejs/require.js"></script>
<script>
/*global eclipse require */
require(["http://orion.eclipse.org/orion/Deferred.js"], function(Deferred) {

		var transformResults = function transformResults(results) {
			return results.map(function(item) {
				return {
					label : item.displayName,
					href: item.link,
					className: item.tasks ? "footerBlock progressNormal" : null, // problem is here!!!!!
					children: item.tasks ? transformResults(item.tasks) : null
				};
			});
		};

		var headers = { name: "Foobar List", version: "0.1", description: "Provides a Foobar List for Orion." };
		var provider = new orion.PluginProvider(headers);
		var impl = function(editorContext, options) {
			var deferred = new Deferred();

			var xhr = new XMLHttpRequest();
			xhr.onreadystatechange = function() {
				if (xhr.readyState == 4 && xhr.status == 200) {
					deferred.resolve(transformResults(JSON.parse(xhr.responseText)));
				}
			}
			xhr.open('GET', '/data/');
			xhr.send();
        	return deferred; 	
        };
        var serviceImpl = {
            computeOutline: impl
        };
        var serviceProperties = {
            name: "Foobar",
            contentType: ["text/plain"],
            id: ["foo.bar.outline"]
        };
        provider.registerService("orion.edit.outliner", serviceImpl, serviceProperties);
		provider.connect();
});
</script>
</head>
<body>
<p>Provides a foobar outliner.</p>
</body>
</html>
Comment 2 Mark Macdonald CLA 2014-01-03 11:08:12 EST 
Should be fixed now. Wherever we allow services to provide a class name, we should allow for multiple class names too. This means the implementation should sue 
 element.className += whatever 
and not
 element.classList.add(whatever)

The classList.add() function only takes a single class in most browsers.