From 415c9561848151fd4b5a204dc93f461165ab7dc3 Mon Sep 17 00:00:00 2001
From: Leibale Eidelman <leibale1998@gmail.com>
Date: Fri, 29 Jun 2018 19:34:43 +0300
Subject: [PATCH] fix(GlobalPositionStrategy): justifyContent center ignored
 when direction is RTL (#11877)

---
 .../position/global-position-strategy.spec.ts      | 14 ++++++++++++++
 .../overlay/position/global-position-strategy.ts   |  2 ++
 2 files changed, 16 insertions(+)

diff --git a/src/cdk/overlay/position/global-position-strategy.spec.ts b/src/cdk/overlay/position/global-position-strategy.spec.ts
index ffee929a135..00941834c04 100644
--- a/src/cdk/overlay/position/global-position-strategy.spec.ts
+++ b/src/cdk/overlay/position/global-position-strategy.spec.ts
@@ -270,6 +270,20 @@ describe('GlobalPositonStrategy', () => {
       expect(elementStyle.height).toBe('300px');
     });
 
+  it('should center the element in RTL', () => {
+      attachOverlay({
+          direction: 'rtl',
+          positionStrategy: overlay.position()
+              .global()
+              .centerHorizontally()
+              .centerVertically()
+      });
+
+      const parentStyle = (overlayRef.overlayElement.parentNode as HTMLElement).style;
+      expect(parentStyle.justifyContent).toBe('center');
+      expect(parentStyle.alignItems).toBe('center');
+  });
+
   it('should invert `justify-content` when using `left` in RTL', () => {
     attachOverlay({
       positionStrategy: overlay.position().global().left('0'),
diff --git a/src/cdk/overlay/position/global-position-strategy.ts b/src/cdk/overlay/position/global-position-strategy.ts
index d6f56820a03..389c6750628 100644
--- a/src/cdk/overlay/position/global-position-strategy.ts
+++ b/src/cdk/overlay/position/global-position-strategy.ts
@@ -169,6 +169,8 @@ export class GlobalPositionStrategy implements PositionStrategy {
 
     if (config.width === '100%') {
       parentStyles.justifyContent = 'flex-start';
+    } else if (this._justifyContent === 'center') {
+        parentStyles.justifyContent = 'center';
     } else if (this._overlayRef.getConfig().direction === 'rtl') {
       // In RTL the browser will invert `flex-start` and `flex-end` automatically, but we
       // don't want that because our positioning is explicitly `left` and `right`, hence