diff --git a/dist/browser/QuillDeltaToHtmlConverter.bundle.js b/dist/browser/QuillDeltaToHtmlConverter.bundle.js index df77899..4fdc1a3 100644 --- a/dist/browser/QuillDeltaToHtmlConverter.bundle.js +++ b/dist/browser/QuillDeltaToHtmlConverter.bundle.js @@ -89,6 +89,9 @@ var DeltaInsertOp = (function () { DeltaInsertOp.prototype.isLink = function () { return this.isText() && !!this.attributes.link; }; + DeltaInsertOp.prototype.isAnchorLink = function () { + return this.isLink() && this.attributes.link.indexOf('#') === 0; + }; DeltaInsertOp.prototype.isCustom = function () { return this.insert instanceof InsertData_1.InsertDataCustom; }; @@ -402,7 +405,7 @@ var OpToHtmlConverter = (function () { .map(function (item) { return arr.preferSecond(item) + ':' + attrs[item[0]]; }); }; OpToHtmlConverter.prototype.getTagAttributes = function () { - if (this.op.attributes.code) { + if (this.op.attributes.code && !this.op.isLink()) { return []; } var makeAttr = function (k, v) { return ({ key: k, value: v }); }; @@ -441,10 +444,12 @@ var OpToHtmlConverter = (function () { var styleAttr = styles.length ? [makeAttr('style', styles.join(';'))] : []; tagAttrs = tagAttrs.concat(styleAttr); if (this.op.isLink()) { - var target = this.op.attributes.target || this.options.linkTarget; tagAttrs = tagAttrs - .concat(makeAttr('href', funcs_html_1.encodeLink(this.op.attributes.link))) - .concat(target ? makeAttr('target', target) : []); + .concat(makeAttr('href', funcs_html_1.encodeLink(this.op.attributes.link))); + if (!this.op.isAnchorLink()) { + var target = this.op.attributes.target || this.options.linkTarget; + tagAttrs = tagAttrs.concat(target ? makeAttr('target', target) : []); + } if (!!this.options.linkRel && OpToHtmlConverter.IsValidRel(this.options.linkRel)) { tagAttrs.push(makeAttr('rel', this.options.linkRel)); } @@ -453,9 +458,6 @@ var OpToHtmlConverter = (function () { }; OpToHtmlConverter.prototype.getTags = function () { var attrs = this.op.attributes; - if (attrs.code) { - return ['code']; - } if (!this.op.isText()) { return [this.op.isVideo() ? 'iframe' : this.op.isImage() ? 'img' @@ -474,9 +476,9 @@ var OpToHtmlConverter = (function () { return firstItem === 'header' ? ['h' + attrs[firstItem]] : [arr.preferSecond(item)]; } } - return [['link', 'a'], ['script'], + return [['link', 'a'], ['mentions', 'a'], ['script'], ['bold', 'strong'], ['italic', 'em'], ['strike', 's'], ['underline', 'u'], - ['mentions', 'a']] + ['code']] .filter(function (item) { return !!attrs[item[0]]; }) .map(function (item) { return item[0] === 'script' ? diff --git a/dist/commonjs/DeltaInsertOp.d.ts b/dist/commonjs/DeltaInsertOp.d.ts index f55ab31..758f454 100644 --- a/dist/commonjs/DeltaInsertOp.d.ts +++ b/dist/commonjs/DeltaInsertOp.d.ts @@ -27,6 +27,7 @@ declare class DeltaInsertOp { isFormula(): boolean; isVideo(): boolean; isLink(): boolean; + isAnchorLink(): boolean; isCustom(): boolean; isMentions(): boolean; } diff --git a/dist/commonjs/DeltaInsertOp.js b/dist/commonjs/DeltaInsertOp.js index 6853665..ebe9aad 100644 --- a/dist/commonjs/DeltaInsertOp.js +++ b/dist/commonjs/DeltaInsertOp.js @@ -88,6 +88,9 @@ var DeltaInsertOp = (function () { DeltaInsertOp.prototype.isLink = function () { return this.isText() && !!this.attributes.link; }; + DeltaInsertOp.prototype.isAnchorLink = function () { + return this.isLink() && this.attributes.link.indexOf('#') === 0; + }; DeltaInsertOp.prototype.isCustom = function () { return this.insert instanceof InsertData_1.InsertDataCustom; }; diff --git a/dist/commonjs/OpToHtmlConverter.js b/dist/commonjs/OpToHtmlConverter.js index 4f1e5ca..e822d97 100644 --- a/dist/commonjs/OpToHtmlConverter.js +++ b/dist/commonjs/OpToHtmlConverter.js @@ -84,7 +84,7 @@ var OpToHtmlConverter = (function () { .map(function (item) { return arr.preferSecond(item) + ':' + attrs[item[0]]; }); }; OpToHtmlConverter.prototype.getTagAttributes = function () { - if (this.op.attributes.code) { + if (this.op.attributes.code && !this.op.isLink()) { return []; } var makeAttr = function (k, v) { return ({ key: k, value: v }); }; @@ -123,10 +123,12 @@ var OpToHtmlConverter = (function () { var styleAttr = styles.length ? [makeAttr('style', styles.join(';'))] : []; tagAttrs = tagAttrs.concat(styleAttr); if (this.op.isLink()) { - var target = this.op.attributes.target || this.options.linkTarget; tagAttrs = tagAttrs - .concat(makeAttr('href', funcs_html_1.encodeLink(this.op.attributes.link))) - .concat(target ? makeAttr('target', target) : []); + .concat(makeAttr('href', funcs_html_1.encodeLink(this.op.attributes.link))); + if (!this.op.isAnchorLink()) { + var target = this.op.attributes.target || this.options.linkTarget; + tagAttrs = tagAttrs.concat(target ? makeAttr('target', target) : []); + } if (!!this.options.linkRel && OpToHtmlConverter.IsValidRel(this.options.linkRel)) { tagAttrs.push(makeAttr('rel', this.options.linkRel)); } @@ -135,9 +137,6 @@ var OpToHtmlConverter = (function () { }; OpToHtmlConverter.prototype.getTags = function () { var attrs = this.op.attributes; - if (attrs.code) { - return ['code']; - } if (!this.op.isText()) { return [this.op.isVideo() ? 'iframe' : this.op.isImage() ? 'img' @@ -156,9 +155,9 @@ var OpToHtmlConverter = (function () { return firstItem === 'header' ? ['h' + attrs[firstItem]] : [arr.preferSecond(item)]; } } - return [['link', 'a'], ['script'], + return [['link', 'a'], ['mentions', 'a'], ['script'], ['bold', 'strong'], ['italic', 'em'], ['strike', 's'], ['underline', 'u'], - ['mentions', 'a']] + ['code']] .filter(function (item) { return !!attrs[item[0]]; }) .map(function (item) { return item[0] === 'script' ? diff --git a/package.json b/package.json index f87a45c..e26b1fa 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "quill-delta-to-html", - "version": "0.9.8", + "version": "0.9.9", "description": "Converts Quill's delta ops to HTML", "main": "./dist/commonjs/main.js", "types": "./dist/commonjs/main.d.ts", diff --git a/src/DeltaInsertOp.ts b/src/DeltaInsertOp.ts index cb45298..a695248 100644 --- a/src/DeltaInsertOp.ts +++ b/src/DeltaInsertOp.ts @@ -123,6 +123,10 @@ class DeltaInsertOp { return this.isText() && !!this.attributes.link; } + isAnchorLink() { + return this.isLink() && this.attributes.link!.indexOf('#') === 0 + } + isCustom() { return this.insert instanceof InsertDataCustom; // return !(this.isText() || diff --git a/src/OpToHtmlConverter.ts b/src/OpToHtmlConverter.ts index a80be19..a8ccfa9 100644 --- a/src/OpToHtmlConverter.ts +++ b/src/OpToHtmlConverter.ts @@ -129,7 +129,7 @@ class OpToHtmlConverter { } getTagAttributes(): Array { - if (this.op.attributes.code) { + if (this.op.attributes.code && !this.op.isLink()) { return []; } @@ -182,10 +182,13 @@ class OpToHtmlConverter { tagAttrs = tagAttrs.concat(styleAttr); if (this.op.isLink()) { - let target = this.op.attributes.target || this.options.linkTarget; tagAttrs = tagAttrs - .concat(makeAttr('href', encodeLink(this.op.attributes.link!))) - .concat(target ? makeAttr('target', target) : []); + .concat(makeAttr('href', encodeLink(this.op.attributes.link!))); + //.concat(target ? makeAttr('target', target) : []); + if (!this.op.isAnchorLink()) { + let target = this.op.attributes.target || this.options.linkTarget; + tagAttrs = tagAttrs.concat(target ? makeAttr('target', target) : []); + } if (!!this.options.linkRel && OpToHtmlConverter.IsValidRel(this.options.linkRel)) { tagAttrs.push(makeAttr('rel', this.options.linkRel)); } @@ -197,11 +200,6 @@ class OpToHtmlConverter { getTags(): string[] { var attrs: any = this.op.attributes; - // code - if (attrs.code) { - return ['code']; - } - // embeds if (!this.op.isText()) { return [this.op.isVideo() ? 'iframe' @@ -225,9 +223,9 @@ class OpToHtmlConverter { } // inlines - return [['link', 'a'], ['script'], + return [['link', 'a'], ['mentions', 'a'], ['script'], ['bold', 'strong'], ['italic', 'em'], ['strike', 's'], ['underline', 'u'], - ['mentions', 'a']] + ['code']] .filter((item: string[]) => !!attrs[item[0]]) .map((item) => { return item[0] === 'script' ? diff --git a/test/QuillDeltaToHtmlConverter.test.ts b/test/QuillDeltaToHtmlConverter.test.ts index c52c006..0f2174a 100644 --- a/test/QuillDeltaToHtmlConverter.test.ts +++ b/test/QuillDeltaToHtmlConverter.test.ts @@ -132,32 +132,32 @@ describe('QuillDeltaToHtmlConverter', function () { }); it('should render target attr correctly', () => { let ops = [ - { "attributes": { "target": "_self", "link": "#" }, "insert": "A" }, - { "attributes": { "target": "_blank", "link": "#" }, "insert": "B" }, - { "attributes": { "link": "#" }, "insert": "C" }, { "insert": "\n" } + { "attributes": { "target": "_self", "link": "http://#" }, "insert": "A" }, + { "attributes": { "target": "_blank", "link": "http://#" }, "insert": "B" }, + { "attributes": { "link": "http://#" }, "insert": "C" }, { "insert": "\n" } ]; let qdc = new QuillDeltaToHtmlConverter(ops, { linkTarget: '' }); let html = qdc.convert(); assert.equal(html, [ - `

A`, - `B`, - `C

` + `

A`, + `B`, + `C

` ].join('')); qdc = new QuillDeltaToHtmlConverter(ops); html = qdc.convert(); assert.equal(html, [ - `

A`, - `B`, - `C

` + `

A`, + `B`, + `C

` ].join('')); qdc = new QuillDeltaToHtmlConverter(ops, { linkTarget: '_top' }); html = qdc.convert(); assert.equal(html, [ - `

A`, - `B`, - `C

` + `

A`, + `B`, + `C

` ].join('')); }); }); diff --git a/test/data/delta1.ts b/test/data/delta1.ts index abf53a1..a1be938 100644 --- a/test/data/delta1.ts +++ b/test/data/delta1.ts @@ -20,7 +20,8 @@ var delta1 = { { "insert": "\n", "attributes": { "list": "bullet" } }, { "insert": "list" }, { "insert": "\n", "attributes": { "list": "checked" } }, - + {"insert": "some code", "attributes":{code:true, bold:true}}, + {"attributes":{"italic":true,"link":"#top","code":true},"insert":"Top"},{"insert":"\n"}, ], html: [ '

', 'link', 'This ', 'is', @@ -33,7 +34,9 @@ var delta1 = { 'inline', ' ', 'x=data', ' formats.

', '', - '' + '', + '

some code', + 'Top

' ].join('') };