Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

It's not possible to define HTML attributes without value #4521

Open
msamsel opened this issue Jun 19, 2019 · 4 comments
Open

It's not possible to define HTML attributes without value #4521

msamsel opened this issue Jun 19, 2019 · 4 comments
Labels
package:engine squad:core Issue to be handled by the Core team. support:2 An issue reported by a commercially licensed client. type:feature This issue reports a feature request (an idea for a new functionality or a missing option).

Comments

@msamsel
Copy link
Contributor

msamsel commented Jun 19, 2019

There is few value-less attributes in HTML which cannot be created with a writer.
e.g. elements as below cannot be created with attributes such as download or required.

<a download href="…">…</a>
<input required type="text">

All elements get values:
https://github.com/ckeditor/ckeditor5-engine/blob/da5670ac2a18186111005cb243f46f9fcfb28b2f/src/view/element.js#L772-L788

@Reinmar
Copy link
Member

Reinmar commented Jun 24, 2019

While this is a missing feature (not really a bug), I'd wonder how important it is taken that required equals required="" (or something similar – can't remember the alternatives). Of course, from a purist's POV, a bare required is better, but it's just a data format, not an art, so from functionality perspective required="" is fine too.

@mlewand
Copy link
Contributor

mlewand commented Jun 24, 2019

The API might be tricky to do this in a way that is compatible with current design. One idea that comes to my mind is to create a dedicated type/value that would be used for that. Something like this:

import EmptyAttribute from 'xyz';

myElement.setAttribute( 'required', EmptyAttribute );

@mlewand mlewand transferred this issue from ckeditor/ckeditor5-engine Oct 9, 2019
@mlewand mlewand added this to the backlog milestone Oct 9, 2019
@mlewand mlewand added status:confirmed type:feature This issue reports a feature request (an idea for a new functionality or a missing option). package:engine labels Oct 9, 2019
@bbenjamin
Copy link

I need to be able to set alt="" with the writer. I've tried the following:
writer.setAttribute('alt', true, viewElement);
writer.setAttribute('alt', null, viewElement);
writer.setAttribute('alt', '', viewElement);

The resulting markup is <img alt="""" /> for each of these, but I need for it to be an empty set of quotes so there's a way to designate an image as decorative and should be skipped by assitive technology. The alt="""" results in it being acknowledged by screenreaders, even thought the tag value has no alphanumeric characters.

@Reinmar Reinmar added the squad:core Issue to be handled by the Core team. label Jan 13, 2022
@Reinmar
Copy link
Member

Reinmar commented Jan 17, 2022

@bbenjamin I tried to reproduce the problem that you're describing but all seems to work fine for me.

For instance, I made Paragrap's downcast to look like this:

		editor.conversion.for( 'downcast' ).elementToElement( {
			model: 'paragraph',
			view: ( modelElement, { writer } ) => {
				const p = writer.createContainerElement( 'p' );

				writer.setAttribute( 'data-foo', '', p );

				return p;
			}
		} );

And the DOM looks good:

The data returned by editor.getData() looks good too:

<h2>Heading 1</h2><p data-foo="">Paragraph</p><p data-foo=""><strong>Bold</strong> <i>Italic</i> <a href="https://ckeditor.com">Link</a></p><ul><li>UL List item 1</li><li>UL List item 2</li></ul><ol><li>OL List item 1</li><li>OL List item 2</li></ol><figure class="image image-style-side"><img src="sample.jpg" alt="bar"><figcaption>Caption</figcaption></figure><blockquote><p data-foo="">Quote</p><ul><li>Quoted UL List item 1</li><li>Quoted UL List item 2</li></ul><p data-foo="">Quote</p></blockquote>'

I also checked that you can have images with empty alt:

<figure class="image image-style-side"><img src="sample.jpg" alt=""><figcaption>Caption</figcaption></figure>

Just to be 100% sure, I changed the value of this image's alt by the model writer (ensuring that the entire pipeline from the model to the view works fine):

editor.model.change( writer => { writer.setAttribute( 'alt', '', editor.model.document.getRoot().getChild( 0 ) ) } );

So, I'm afraid the issue is somewhere outside CKE5's code. One thing I'd check for sure is the custom HTML writer that you use.

@pomek pomek removed this from the backlog milestone Feb 21, 2022
@aldonace-wu aldonace-wu added the support:2 An issue reported by a commercially licensed client. label Jan 20, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package:engine squad:core Issue to be handled by the Core team. support:2 An issue reported by a commercially licensed client. type:feature This issue reports a feature request (an idea for a new functionality or a missing option).
Projects
None yet
Development

No branches or pull requests

6 participants