Trapping errors in URL formatting and displaying an error message
This commit is contained in:
		
							parent
							
								
									66b3c76f9a
								
							
						
					
					
						commit
						80e96c7bd3
					
				@ -23,7 +23,8 @@ describe('regexper.js', function() {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
    this.regexper = new Regexper(this.root);
 | 
					    this.regexper = new Regexper(this.root);
 | 
				
			||||||
    spyOn(this.regexper, '_setHash');
 | 
					    spyOn(this.regexper, '_setHash');
 | 
				
			||||||
    spyOn(this.regexper, '_getHash').and.returnValue('example hash value');
 | 
					    spyOn(this.regexper, '_getHash');
 | 
				
			||||||
 | 
					    spyOn(window._gaq, 'push');
 | 
				
			||||||
  });
 | 
					  });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  describe('#keypressListener', function() {
 | 
					  describe('#keypressListener', function() {
 | 
				
			||||||
@ -179,15 +180,42 @@ describe('regexper.js', function() {
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
  describe('#hashchangeListener', function() {
 | 
					  describe('#hashchangeListener', function() {
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    it('enables the permalink', function() {
 | 
					    describe('when the URL is invalid', function() {
 | 
				
			||||||
      this.regexper.hashchangeListener();
 | 
					
 | 
				
			||||||
      expect(this.regexper.permalinkEnabled).toEqual(true);
 | 
					      beforeEach(function() {
 | 
				
			||||||
 | 
					        this.regexper._getHash.and.returnValue(new Error('example error'));
 | 
				
			||||||
 | 
					      });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      it('displays an error message', function() {
 | 
				
			||||||
 | 
					        this.regexper.hashchangeListener();
 | 
				
			||||||
 | 
					        expect(this.regexper.state).toEqual('has-error');
 | 
				
			||||||
 | 
					        expect(this.regexper.error.innerHTML).toEqual('Malformed expression in URL');
 | 
				
			||||||
 | 
					      });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      it('tracks the event', function() {
 | 
				
			||||||
 | 
					        this.regexper.hashchangeListener();
 | 
				
			||||||
 | 
					        expect(window._gaq.push).toHaveBeenCalledWith(['_trackEvent', 'visualization', 'malformed URL']);
 | 
				
			||||||
 | 
					      });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    });
 | 
					    });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    it('shows the expression from the hash', function() {
 | 
					    describe('when the URL is valid', function() {
 | 
				
			||||||
      spyOn(this.regexper, 'showExpression');
 | 
					
 | 
				
			||||||
      this.regexper.hashchangeListener();
 | 
					      beforeEach(function() {
 | 
				
			||||||
      expect(this.regexper.showExpression).toHaveBeenCalledWith('example hash value');
 | 
					        this.regexper._getHash.and.returnValue('example hash value');
 | 
				
			||||||
 | 
					      });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      it('enables the permalink', function() {
 | 
				
			||||||
 | 
					        this.regexper.hashchangeListener();
 | 
				
			||||||
 | 
					        expect(this.regexper.permalinkEnabled).toEqual(true);
 | 
				
			||||||
 | 
					      });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					      it('shows the expression from the hash', function() {
 | 
				
			||||||
 | 
					        spyOn(this.regexper, 'showExpression');
 | 
				
			||||||
 | 
					        this.regexper.hashchangeListener();
 | 
				
			||||||
 | 
					        expect(this.regexper.showExpression).toHaveBeenCalledWith('example hash value');
 | 
				
			||||||
 | 
					      });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    });
 | 
					    });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  });
 | 
					  });
 | 
				
			||||||
@ -352,7 +380,6 @@ describe('regexper.js', function() {
 | 
				
			|||||||
      spyOn(Parser.prototype, 'render').and.returnValue(this.renderPromise.promise);
 | 
					      spyOn(Parser.prototype, 'render').and.returnValue(this.renderPromise.promise);
 | 
				
			||||||
      spyOn(Parser.prototype, 'cancel');
 | 
					      spyOn(Parser.prototype, 'cancel');
 | 
				
			||||||
 | 
					
 | 
				
			||||||
      spyOn(window._gaq, 'push');
 | 
					 | 
				
			||||||
      spyOn(this.regexper, 'updateLinks');
 | 
					      spyOn(this.regexper, 'updateLinks');
 | 
				
			||||||
      spyOn(this.regexper, 'displayWarnings');
 | 
					      spyOn(this.regexper, 'displayWarnings');
 | 
				
			||||||
    });
 | 
					    });
 | 
				
			||||||
 | 
				
			|||||||
@ -53,8 +53,16 @@ export default class Regexper {
 | 
				
			|||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  hashchangeListener() {
 | 
					  hashchangeListener() {
 | 
				
			||||||
    this.permalinkEnabled = true;
 | 
					    var expr = this._getHash();
 | 
				
			||||||
    this.showExpression(this._getHash());
 | 
					
 | 
				
			||||||
 | 
					    if (expr instanceof Error) {
 | 
				
			||||||
 | 
					      this.state = 'has-error';
 | 
				
			||||||
 | 
					      this.error.innerHTML = 'Malformed expression in URL';
 | 
				
			||||||
 | 
					      window._gaq.push(['_trackEvent', 'visualization', 'malformed URL']);
 | 
				
			||||||
 | 
					    } else {
 | 
				
			||||||
 | 
					      this.permalinkEnabled = true;
 | 
				
			||||||
 | 
					      this.showExpression(expr);
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  bindListeners() {
 | 
					  bindListeners() {
 | 
				
			||||||
@ -69,7 +77,12 @@ export default class Regexper {
 | 
				
			|||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  _getHash() {
 | 
					  _getHash() {
 | 
				
			||||||
    return decodeURIComponent(location.hash.slice(1));
 | 
					    try {
 | 
				
			||||||
 | 
					      return decodeURIComponent(location.hash.slice(1));
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					    catch(e) {
 | 
				
			||||||
 | 
					      return e;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  set state(state) {
 | 
					  set state(state) {
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user