huang47/nodejs-html-truncate

truncate html text and keep tag safe

👋 Hi there

👀 I'm passionate about technology and software development, and I enjoy working on a wide range of projects. I have experience in frontend development, and I'm always looking to learn more and improve my skills. I believe that staying up-to-date with the latest technologies and trends is essential for any developer, and I'm committed to constantly learning and growing in my field.

🌱 Currently, I'm working on several open-source projects, and I'm excited to share my work and contribute to the development community. I love collaborating with others and learning from their experiences, and I'm always open to new ideas and perspectives. Whether I'm working on a personal project or collaborating with a team, I strive to create high-quality, well-designed software that meets the needs of its users.

💞 In addition to my interest in technology, I also have experience in business and management. I believe that good software development goes hand-in-hand with effective project management and strategic thinking. I enjoy reading about the latest trends in these fields and learning from other professionals who have successfully navigated the challenges of building and growing a business.

📫 If you're interested in collaborating on projects or discussing ideas, feel free to reach out and connect with me on GitHub. I'm always looking for new opportunities to learn and grow, and I'm excited to connect with other like-minded developers and professionals. You can find me at https://github.com/huang47, and I'm looking forward to working with you!

generated by ChatGPT at 1670638144289

nodejs-html-truncate's Issues

bug with elipsis

    input = 'feafawefaefawfafeafafeafeeaefa feawfaweffeawfeafeafaefafeafafaeafeafeafaefafeafaefaefa <span class="wurl"><a href="http://google.com" target="_blank" rel="nofollow">http://google.com</a></span>';
    actual = truncate(input, 100);
    expect = 'feafawefaefawfafeafafeafeeaefa feawfaweffeawfeafeafaefafeafafaeafeafeafaefafeafaefaefa <span class="wurl"><a href="http://google.com" target="_blank" rel="nofollow">http://google...</a></span>';
    assert.strictEqual(actual, expect);

is this a bug?

here is a more simple version:

    input  = 'thisare19characters <a href="http://google.com">http://google.com</a>';
    actual = truncate(input, 33);
    expect = 'thisare19characters <a href="http://google.com">http://google...</a>';
    assert.strictEqual(actual, expect);

I think the problem comes from here https://github.com/huang47/nodejs-html-truncate/blob/master/truncate.js#L166 :

After breaking from the loop string is the remaining content of the string which doesn't make sense to compare for maxLength. shouldn't this be: total > maxLength?

Broken with data- attribute?

Haven't tested this, but by looking at your code, KEY_VALUE_REGEX will probably break on data- attributes.

Truncate Regex Causes Infinite Loop

This commit adds no value attributes to the truncation process but also introduces an infinite loop. Running this regex: KEY_VALUE_REGEX = '([\w|-]+\s*(=\s*"[^"]")?\s)*' on an iframe with attributes with and without values will result in the process freezing. For example, this bit of code will result in the process locking:
<iframe width="560" height="315" src="//www.youtube.com/embed/eFGolAT2l6c" frameborder="0" allowfullscreen></iframe>

The specific line that freezes is 205:
selfClose = SELF_CLOSE_REGEX.exec(result);

This error can be reproduced by executing that line of code, having set the pertinent values, on the command line. I've also written a test to demonstrate the problem on this branch:

master...jbasdf:locking_bug

truncate fails on plain text without HTML

Thank you for a nice library. I've stumbled upon a bug the other day.

I cannot figure out exactly when this happens, but I have an example: https://runkit.com/hofft/5877633764cddc00146690a8

var truncate = require("html-truncate");
var str = 'abc (http://doi.org/10.3897/zookeys.555.6173) The dataset contains close to 2.5 million occurrences, recorded by 101 GPS trackers mounted on 75 Lesser Black-backed Gulls and 26 Herring Gulls breeding at the Belgian and Dutch coast (see https://inbo.cartodb.com/u/lifewatch/viz/da04f120-ea70-11e4-a3f2-0e853d047bba/public_map for a visualization of the data). (UvA-BiTS, http://www.uva-bits.nl). ';

//not being html I would expect it to have length ~3
console.log(truncate(str, 3)); 

/not being html I would expect it to have length ~13
console.log(truncate(str, 13)); 

result

"abc..."
and
"abc (http://doi.org/10.3897/zookeys.555.6173) The dataset contains close to 2.5 million occurrences, recorded by 101 GPS trackers mounted on 75 Lesser Black-backed Gulls and 26 Herring Gulls breeding at the Belgian and Dutch coast (see https://inbo.cartodb.com/u/lifewatch/viz/da04f120-ea70-11e4-a3f2-0e853d047bba/public_map..."

basically it seems that having multiple urls in the text breaks the truncating.

Thanks

Long attribute keys take a very long time to process

This code times a bunch of attribute keys:

const truncate = require('html-truncate');

function timeTruncate(html) {
    const start = Date.now();
    truncate(html, 0);
    const end = Date.now();
    console.log(`${end - start}ms for ${html}`)
}

timeTruncate('<div a="x"></div>');
timeTruncate('<div a00000009="x"></div>');
timeTruncate('<div a000000010="x"></div>');
timeTruncate('<div a0000000011="x"></div>');
timeTruncate('<div a00000000012="x"></div>');
timeTruncate('<div a000000000013="x"></div>');
timeTruncate('<div a0000000000014="x"></div>');
timeTruncate('<div a00000000000015="x"></div>');
timeTruncate('<div a000000000000016="x"></div>');
timeTruncate('<div a0000000000000017="x"></div>');
timeTruncate('<div a00000000000000018="x"></div>');
timeTruncate('<div a000000000000000019="x"></div>');
timeTruncate('<div a0000000000000000020="x"></div>');
timeTruncate('<div a00000000000000000021="x"></div>');
timeTruncate('<div a000000000000000000022="x"></div>');
timeTruncate('<div a0000000000000000000023="x"></div>');
timeTruncate('<div a00000000000000000000024="x"></div>');
timeTruncate('<div a000000000000000000000025="x"></div>');

The results, with html-truncate 1.2.2 and Node v8.9.0:

1ms for <div a="x"></div>
1ms for <div a00000009="x"></div>
0ms for <div a000000010="x"></div>
1ms for <div a0000000011="x"></div>
2ms for <div a00000000012="x"></div>
3ms for <div a000000000013="x"></div>
5ms for <div a0000000000014="x"></div>
12ms for <div a00000000000015="x"></div>
22ms for <div a000000000000016="x"></div>
34ms for <div a0000000000000017="x"></div>
67ms for <div a00000000000000018="x"></div>
122ms for <div a000000000000000019="x"></div>
230ms for <div a0000000000000000020="x"></div>
450ms for <div a00000000000000000021="x"></div>
880ms for <div a000000000000000000022="x"></div>
1828ms for <div a0000000000000000000023="x"></div>
4199ms for <div a00000000000000000000024="x"></div>
7585ms for <div a000000000000000000000025="x"></div>

Things start getting a little out of hand beyond ten characters.

Possibly related to #24?

Properly handle unicode strings outside of the BMP

Because of javascript's poor implementation of unicode, this library will split certain unicode characters and cause a broken result.

Example:

var trunc = require("html-truncate");
trunc("☃💩☃", 2) => "☃�..."

Emoji are the most popular characters where this will happen and are pretty common for user content these days.

Img attributes with single quotes result in invalid tags

var trunc = require("html-truncate")
trunc("<p>osito<img src='http://example.com/img.jpg' width='100'/>oscuro</p>", 8)

Results in:

'<p>osito<im…</p>'

Note the truncated img tag. I tried it with and without keepImageTag and it didn't make a difference.

When you use double quotes for the src and width attributes, it behaves as expected. I tried the example with html-ellipsis and the above works as expected, preserving the img tag.

Do not work with slef closing tag like input or br

it adds a closing tag at the end of the sentence and mess up the nodes.

Problem handling entities

I'm seeing problems with properly entities, particularly with shorter strings. For example:

var truncate = require("html-truncate");
truncate( "<p>David &amp; Jenny</p>", 13, { ellipsis: "" } );

returns "David & J"

truncate( "<p>D&amp;C</p>", 4, { ellipsis: "" } );

returns "D&am"

Library does not truncate text of links

Hi there!

I started using this library some time ago and I've noticed that it is not truncating links.

If I have a link, e.g.

<a href="someUrl">SomeLongTextOfALinkEvenLongerThanThis</a>

then this library is always going to display the whole text (I mean the "SomeLongTextOfALinkEvenLongerThanThis"), it does not truncate it.

Another thing - If you have a clickable block of text from a source that you don't control (e.g. RSS channel), then there's no way to simply truncate it with this library - you need to do additional work.

Please, have a look at this problem.

Regards,

• Damian Wojakowski.

Causes serious issue about "events" with NativeScript

Doesn't work with <img /> tags, somehow

var t = require('html-truncate');
t('<ul><li><img src="image-1" /><img src="image-2" /></li></ul>', 40);

...returns

<ul><li><img src="image-2" /><img src="image-2" />

...rather than anything sensible.

Moreover, increasing the requested length doesn't fix it (passing 1000 instead of 40) gives the same result.

should update main entry to lib/truncate.js

1.2.0 now uses browserify and might break compatibility for any users which require it directly.

Should convert html entities to chars before processing

I think this module should be converting html entities to chars before processing, so & should become & only then we could truncate.

After executing the following:
truncate("FIFA Tournaments - Players &amp; Coaches - <b>Mario BALOTELLI</b>", 50)

expected:
FIFA Tournaments - Players &amp; Coaches - <b>Mario BALOT</b>

actual:
FIFA Tournaments - Players &amp; Coaches - <b>Mario B</b>

IE 7-8 issue

Have you tested this script for IE 7-8? Looks like in _dumpCloseTag passes array of all tags in string. Try to test with string full of tags with table at the end.