Skip to content

Commit

Permalink
Do not issue request for undefined hrefs
Browse files Browse the repository at this point in the history
  • Loading branch information
alshakero committed Nov 27, 2017
1 parent 06976df commit 8e8fb72
Show file tree
Hide file tree
Showing 2 changed files with 41 additions and 27 deletions.
60 changes: 33 additions & 27 deletions juicy-html.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,12 @@
version: 2.0.1
-->
<script>
(function(scope) {
(function (scope) {
/**
* Throw a warning to the console about deprecated content attribute
* @param {JuicyHTMLElement} element reference to the element
*/
function warnAboutDeprecatedContentOn(element){
function warnAboutDeprecatedContentOn(element) {
console.warn(
'`content` attribute is deprecated! Please, use `href` or `html` instead.',
element,
Expand All @@ -23,7 +23,7 @@
* @param {JuicyHTMLElement} element to set attibutes on
* @param {String} value value of content attr
*/
function forwardContentValue(element, value){
function forwardContentValue(element, value) {
if (value && (value.indexOf('/') === 0 || value.indexOf('./') === 0 || value.indexOf('../') === 0)) {
//value is a URL, load the partial from external file
element.removeAttribute('html');
Expand All @@ -37,43 +37,49 @@
element.setAttribute('html', value);
}
}
/**
* Checks whether a value is null or undefined
*/
function nullOrUndefined(v) {
return v === null || v === undefined;
}

var JuicyHTMLPrototype = Object.create((HTMLTemplateElement || HTMLElement).prototype);
var isSafari = navigator.vendor && navigator.vendor.indexOf("Apple") > -1 && navigator.userAgent && !navigator.userAgent.match("CriOS");

JuicyHTMLPrototype.createdCallback = function() {
JuicyHTMLPrototype.createdCallback = function () {
var model = null; // XXX(tomalec): || this.model ? // to consider for https://github.com/Juicy/juicy-html/issues/30
Object.defineProperties(this, {
'model': {
set: function(newValue) {
set: function (newValue) {
model = newValue;
this.attachModel(newValue);
},
get: function() {
get: function () {
return model;
}
},
'href': {
set: function(newValue) {
if(newValue === null){
set: function (newValue) {
if (nullOrUndefined(newValue)) {
this.removeAttribute('href');
} else {
this.setAttribute('href', newValue);
}
},
get: function() {
get: function () {
return this.getAttribute('href');
}
},
'html': {
set: function(newValue) {
if(newValue === null){
set: function (newValue) {
if (nullOrUndefined(newValue)) {
this.removeAttribute('html');
} else {
this.setAttribute('html', newValue);
}
},
get: function() {
get: function () {
return this.getAttribute('html');
}
}
Expand All @@ -89,8 +95,8 @@
/**
* Skips/disregards pending request if any.
*/
JuicyHTMLPrototype.skipStampingPendingFile = function() {
if(this.pending){
JuicyHTMLPrototype.skipStampingPendingFile = function () {
if (this.pending) {
this.pending.onload = null;
}
};
Expand All @@ -99,22 +105,22 @@
* @param {String} url relative/absolute string to load the resource
* @return {HTMLElement} itself
*/
JuicyHTMLPrototype._loadExternalFile = function(url){
JuicyHTMLPrototype._loadExternalFile = function (url) {
var oReq = new XMLHttpRequest();
var that = this;
this.pending = oReq;
oReq.onload = function(event) {
oReq.onload = function (event) {
that.pending = null;
that.reattachTemplate_(event.target.responseText, oReq.status);
};
oReq.open("GET", url, true);
oReq.send();
};

JuicyHTMLPrototype.reattachTemplate_ = function(html, statusCode) {
JuicyHTMLPrototype.reattachTemplate_ = function (html, statusCode) {
this.clear();
if(html === ''){
if(statusCode === 204){
if (html === '') {
if (statusCode === 204) {
console.info('no content was returned for juicy-html', this);
} else {
console.warn('content given for juicy-html is an empty file', this);
Expand Down Expand Up @@ -143,7 +149,7 @@
/**
* Remove stamped content.
*/
JuicyHTMLPrototype.clear = function() {
JuicyHTMLPrototype.clear = function () {
var parent = this.parentNode;
var childNo = this.stampedNodes && this.stampedNodes.length || 0;
var child;
Expand All @@ -159,7 +165,7 @@
};

JuicyHTMLPrototype.isAttached = false;
JuicyHTMLPrototype.attachedCallback = function() {
JuicyHTMLPrototype.attachedCallback = function () {
this.isAttached = true;
// autostamp
// TODO(tomalec): read pre-upgrade properties in cheap manner
Expand All @@ -168,11 +174,11 @@
// translate legacy `content` attribute
this.hasAttribute('content') && this.attributeChangedCallback('content', null, this.getAttribute('content'));
};
JuicyHTMLPrototype.detachedCallback = function() {
JuicyHTMLPrototype.detachedCallback = function () {
this.isAttached = false;
this.clear();
};
JuicyHTMLPrototype.attributeChangedCallback = function(name, oldVal, newVal) {
JuicyHTMLPrototype.attributeChangedCallback = function (name, oldVal, newVal) {
if (this.isAttached) {
switch (name) {
case "model":
Expand All @@ -188,15 +194,15 @@
case "href":
// skip pending request
this.skipStampingPendingFile();
if(newVal !== null){
if (newVal !== null) {
this.removeAttribute('html');
this._loadExternalFile(newVal);
} else {
this.clear();
}
break;
case "html":
if(newVal !== null){
if (newVal !== null) {
this.removeAttribute('href');
this.reattachTemplate_(newVal);
} else {
Expand All @@ -207,7 +213,7 @@
}
};

JuicyHTMLPrototype.attachModel = function(model, arrayOfElements) {
JuicyHTMLPrototype.attachModel = function (model, arrayOfElements) {
arrayOfElements || (arrayOfElements = this.stampedNodes);
if (model === null || !arrayOfElements) {
return;
Expand All @@ -222,4 +228,4 @@
extends: "template"
});
})(window);
</script>
</script>
8 changes: 8 additions & 0 deletions test/skipping.html
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,14 @@
expect(myEl.skipStampingPendingFile).not.to.be.called;
});
});
describe("Undefined URL", function() {
it("It shouldn't issue a request if URL is undefined", function() {
myEl = fixture('juicy-html-fixture').querySelector('template[is="juicy-html"]');
sinon.spy(myEl, '_loadExternalFile');
myEl.href = undefined;
expect(myEl._loadExternalFile).not.to.be.called;
});
});
});
</script>

Expand Down

0 comments on commit 8e8fb72

Please sign in to comment.