Skip to content
This repository was archived by the owner on Apr 12, 2024. It is now read-only.

refactor($sniffer): remove $sniffer.vendorPrefix #15287

Merged
merged 1 commit into from
Oct 19, 2016
+26 −77
Merged

refactor($sniffer): remove $sniffer.vendorPrefix #15287

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
29 changes: 5 additions & 24 deletions src/ng/sniffer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,33 +34,15 @@ function $SnifferProvider() {
toInt((/android (\d+)/.exec(lowercase(($window.navigator || {}).userAgent)) || [])[1]),
boxee = /Boxee/i.test(($window.navigator || {}).userAgent),
document = $document[0] || {},
vendorPrefix,
vendorRegex = /^(Moz|webkit|ms)(?=[A-Z])/,
bodyStyle = document.body && document.body.style,
transitions = false,
animations = false,
match;
animations = false;

if (bodyStyle) {
for (var prop in bodyStyle) {
if ((match = vendorRegex.exec(prop))) {
vendorPrefix = match[0];
vendorPrefix = vendorPrefix[0].toUpperCase() + vendorPrefix.substr(1);
break;
}
}

if (!vendorPrefix) {
vendorPrefix = ('WebkitOpacity' in bodyStyle) && 'webkit';
}

transitions = !!(('transition' in bodyStyle) || (vendorPrefix + 'Transition' in bodyStyle));
animations = !!(('animation' in bodyStyle) || (vendorPrefix + 'Animation' in bodyStyle));

if (android && (!transitions || !animations)) {
transitions = isString(bodyStyle.webkitTransition);
animations = isString(bodyStyle.webkitAnimation);
}
// Support: Android <5, Blackberry Browser 10, default Chrome in Android 4.4.x
// Mentioned browsers need a -webkit- prefix for transitions & animations.
transitions = !!('transition' in bodyStyle || 'webkitTransition' in bodyStyle);
animations = !!('animation' in bodyStyle || 'webkitAnimation' in bodyStyle);
}


Expand Down Expand Up @@ -90,7 +72,6 @@ function $SnifferProvider() {
return eventSupport[event];
},
csp: csp(),
vendorPrefix: vendorPrefix,
transitions: transitions,
animations: animations,
android: android
Expand Down
16 changes: 10 additions & 6 deletions test/helpers/privateMocks.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ function browserSupportsCssAnimations() {
return !(window.document.documentMode < 10);
}

function createMockStyleSheet(doc, prefix) {
function createMockStyleSheet(doc) {
doc = doc ? doc[0] : window.document;

var node = doc.createElement('style');
Expand All @@ -57,13 +57,17 @@ function createMockStyleSheet(doc, prefix) {
},

addPossiblyPrefixedRule: function(selector, styles) {
if (prefix) {
var prefixedStyles = styles.split(/\s*;\s*/g).map(function(style) {
return !style ? '' : prefix + style;
// Support: Android <5, Blackberry Browser 10, default Chrome in Android 4.4.x
// Mentioned browsers need a -webkit- prefix for transitions & animations.
var prefixedStyles = styles.split(/\s*;\s*/g)
.filter(function(style) {
return style && /^(?:transition|animation)\b/.test(style);
})
.map(function(style) {
return '-webkit-' + style;
}).join('; ');

this.addRule(selector, prefixedStyles);
}
this.addRule(selector, prefixedStyles);

this.addRule(selector, styles);
},
Expand Down
43 changes: 4 additions & 39 deletions test/ng/snifferSpec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -172,39 +172,6 @@ describe('$sniffer', function() {
});


describe('vendorPrefix', function() {
it('should return the correct vendor prefix based on the browser', function() {
inject(function($sniffer, $window) {
var expectedPrefix;
var ua = $window.navigator.userAgent.toLowerCase();
if (/edge/i.test(ua)) {
expectedPrefix = 'Ms';
} else if (/chrome/i.test(ua) || /safari/i.test(ua) || /webkit/i.test(ua)) {
expectedPrefix = 'Webkit';
} else if (/firefox/i.test(ua)) {
expectedPrefix = 'Moz';
} else if (/ie/i.test(ua) || /trident/i.test(ua)) {
expectedPrefix = 'Ms';
}
expect($sniffer.vendorPrefix).toBe(expectedPrefix);
});
});


it('should still work for an older version of Webkit', function() {
var mockDocument = {
body: {
style: {
WebkitOpacity: '0'
}
}
};

expect(sniffer({}, mockDocument).vendorPrefix).toBe('webkit');
});
});


describe('animations', function() {
it('should be either true or false', inject(function($sniffer) {
expect($sniffer.animations).toBeDefined();
Expand All @@ -222,13 +189,12 @@ describe('$sniffer', function() {
});


it('should be true with vendor-specific animations', function() {
it('should be true with -webkit-prefixed animations', function() {
var animationStyle = 'some_animation 2s linear';
var mockDocument = {
body: {
style: {
WebkitAnimation: animationStyle,
MozAnimation: animationStyle
webkitAnimation: animationStyle
}
}
};
Expand Down Expand Up @@ -299,13 +265,12 @@ describe('$sniffer', function() {
});


it('should be true with vendor-specific transitions', function() {
it('should be true with -webkit-prefixed transitions', function() {
var transitionStyle = '1s linear all';
var mockDocument = {
body: {
style: {
WebkitTransition: transitionStyle,
MozTransition: transitionStyle
webkitTransition: transitionStyle
}
}
};
Expand Down
15 changes: 7 additions & 8 deletions test/ngAnimate/animateCssSpec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,8 @@ describe('ngAnimate $animateCss', function() {
}

function getPossiblyPrefixedStyleValue(element, styleProp) {
var value = element.css(prefix + styleProp);
if (isUndefined(value)) value = element.css(styleProp);
var value = element.css(styleProp);
if (isUndefined(value)) value = element.css('-webkit-' + styleProp);

return value;
}
Expand All @@ -40,11 +40,10 @@ describe('ngAnimate $animateCss', function() {
color: 'blue'
};

var ss, prefix, triggerAnimationStartFrame;
var ss, triggerAnimationStartFrame;
beforeEach(module(function() {
return function($document, $sniffer, $$rAF, $animate) {
prefix = '-' + $sniffer.vendorPrefix.toLowerCase() + '-';
ss = createMockStyleSheet($document, prefix);
ss = createMockStyleSheet($document);

$animate.enabled(true);
triggerAnimationStartFrame = function() {
Expand Down Expand Up @@ -873,8 +872,8 @@ describe('ngAnimate $animateCss', function() {

angular.element($document[0].body).append($rootElement);

ss.addRule('.ng-enter-stagger', prefix + 'animation-delay:0.2s');
ss.addRule('.transition-animation', 'transition:2s 5s linear all;');
ss.addPossiblyPrefixedRule('.ng-enter-stagger', 'animation-delay:0.2s');
ss.addPossiblyPrefixedRule('.transition-animation', 'transition:2s 5s linear all;');

for (var i = 0; i < 5; i++) {
var element = angular.element('<div class="transition-animation"></div>');
Expand Down Expand Up @@ -2508,7 +2507,7 @@ describe('ngAnimate $animateCss', function() {
}
}, function(testDetailsFactory) {
inject(function($animateCss, $rootElement) {
var testDetails = testDetailsFactory(prefix);
var testDetails = testDetailsFactory();

ss.addPossiblyPrefixedRule('.ng-enter', testDetails.css);
var options = {
Expand Down