layout: Mark flex items properly during construction

Set the flag of the fragment of children in a flex container according
to the direction of the container. The mark is done on the fragment
because flex item enstablish a stacking context when its z-index is
non-zero ,despite its `position' property.

components/layout/flex.rs

@@ -395,6 +395,10 @@ impl FlexFlow {
         }
     }
 
+    pub fn main_mode(&self) -> Direction {
+        self.main_mode
+    }
+
     /// Returns a line start after the last item that is already in a line.
     /// Note that when the container main size is infinite(i.e. A column flexbox with auto height),
     /// we do not need to do flex resolving and this can be considered as a fast-path, so the
@@ -613,8 +617,6 @@ impl FlexFlow {
                 //
                 // TODO(#2265, pcwalton): Do this in the cascade instead.
                 block.base.flags.set_text_align(containing_block_text_align);
-                // FIXME(stshine): should this be done during construction?
-                block.mark_as_flex();
 
                 let margin = block.fragment.style().logical_margin();
                 let auto_len =
@@ -810,6 +812,14 @@ impl Flow for FlexFlow {
         FlowClass::Flex
     }
 
+    fn as_mut_flex(&mut self) -> &mut FlexFlow {
+        self
+    }
+
+    fn as_flex(&self) -> &FlexFlow {
+        self
+    }
+
     fn as_block(&self) -> &BlockFlow {
         &self.block_flow
     }