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

Commit b1fb32c

Browse files
fix(layout): resolve minify bug with flex css
* fix minimize bug where `flex: 1 1 0%` incorrectly becomes `flex: 1 1 0`; * do not support md-css-only; JS is always required * do not remove layout attributes
1 parent cd63f69 commit b1fb32c

File tree

3 files changed

+4
-56
lines changed

3 files changed

+4
-56
lines changed

src/core/services/layout/layout.js

+3-40
Original file line numberDiff line numberDiff line change
@@ -54,13 +54,8 @@
5454
* Do NOT remove the original layout Attribute selectors
5555
* after translation injection; or the media breakpoints will not fire
5656
*/
57-
removeAttributes : true,
57+
removeAttributes : true
5858

59-
/**
60-
* Special internal flag used to optimize
61-
* noop(s) for the directive postLinks below
62-
*/
63-
enablePostLinks : undefined
6459
};
6560
})
6661

@@ -173,11 +168,9 @@
173168
return {
174169
restrict : 'A',
175170
compile: function(element, attr) {
176-
var injected = injectLayoutSpecifier(element, attr);
177-
var enabled = isPostLinkEnabled($document[0]);
178-
179171
// Use for postLink to account for transforms after ng-transclude.
180-
if ( !injected && enabled ) {
172+
173+
if ( !injectLayoutSpecifier(element, attr) ) {
181174
attributeValueToClass(null, element, attr);
182175
return attributeValueToClass;
183176
}
@@ -289,7 +282,6 @@
289282
return {
290283
restrict : 'A',
291284
compile: function(element, attrs) {
292-
if ( !isPostLinkEnabled($document[0]) ) return angular.noop;
293285

294286
attributeToClass(null, element);
295287

@@ -327,33 +319,4 @@
327319

328320
}
329321

330-
/**
331-
* Scan the body element. If it has a class 'md-css-only', then do NOT
332-
* postLink process the directives for Attribute selectors.
333-
* (recall that postlink injects Class selectors based on attribute selector settings)
334-
*
335-
* Instead the Layout CSS for Attributes is used:
336-
* e.g
337-
* .md-css-only [layout=row] {
338-
* flex-direction: row;
339-
* -webkit-flex-direction: row;
340-
* }
341-
*
342-
* Note: this means that 'md-css-only' will not work for IE (due to performance issues)
343-
* In these cases, the Layout translators (directives) should be enabled and the
344-
* `angular-material.[min.]js` must be loaded.
345-
*/
346-
function isPostLinkEnabled(document) {
347-
var enablePostLinks = $$mdLayout.enablePostLinks;
348-
349-
// Perform a read-once (1x) check for the `md-css-only` class on the BODY
350-
351-
if ( angular.isUndefined(enablePostLinks) ) {
352-
var body = document && document.body;
353-
if (body) enablePostLinks = !body.classList.contains('md-css-only');
354-
}
355-
356-
return $$mdLayout.enablePostLinks = enablePostLinks;
357-
}
358-
359322
})();

src/core/services/layout/layout.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -182,7 +182,7 @@
182182
box-sizing: border-box;
183183
}
184184

185-
.#{$flexName} { flex: 1 1 0%; }
185+
.#{$flexName} { flex: 1; } // === 1 1 0%
186186
.#{$flexName}-grow { flex: 1 1 100%; }
187187
.#{$flexName}-initial { flex: 0 1 auto; }
188188
.#{$flexName}-auto { flex: 1 1 auto; }

src/core/services/layout/layout.spec.js

-15
Original file line numberDiff line numberDiff line change
@@ -47,20 +47,6 @@ describe('layout directives', function() {
4747
var element = $compile('<div ' + attribute + '>Layout</div>')($rootScope.$new());
4848
expect(element.hasClass(expectedClass)).toBe(true);
4949
}));
50-
51-
it('should not add the class ' + expectedClass + ' if the body class has "md-css-only" ' + attribute, inject(function($$mdLayout, $compile, $rootScope, $document) {
52-
$$mdLayout.enablePostLinks = undefined;
53-
54-
var body = angular.element($document[0].body);
55-
body.addClass('md-css-only');
56-
57-
var element = $compile('<div ' + attribute + '>Layout</div>')($rootScope.$new());
58-
expect(element.hasClass(expectedClass)).toBe(false);
59-
60-
body.removeClass('md-css-only');
61-
$$mdLayout.enablePostLinks = undefined;
62-
63-
}));
6450
}
6551

6652
/** Test directives with 'sm', 'gt-sm', 'md', 'gt-md', 'lg', and 'gt-lg' suffixes */
@@ -146,7 +132,6 @@ describe('layout directives', function() {
146132
expect(element.hasClass('flex-gt-md-32')).toBe(false);
147133
expect(element.hasClass('flex-gt-md-fishCheeks')).toBe(true);
148134

149-
expect(element.attr('flex-gt-md')).toBeFalsy();
150135
}));
151136

152137
})

0 commit comments

Comments
 (0)