Merge pull request #3 from ModestCoders/fixes-and-improvements

Fixes and improvements

Author: danielozano

CHANGELOG.md

@@ -11,11 +11,16 @@ and this project adheres to [Semantic Version](http://semver.org/spec/v2.0.0.htm
 
 ### Removed
 
-## [1.1] - 18-08-2018
+## [1.1] - 24-08-2018
 ### Changed
 
 * Use `modestcoders/unison:2.51.2` image for unison container
 * Update `markoshust/magento-php` images to PHP `7.1` using tag `7.1-fpm-3`
+* Update docker setup with fixes for node and integration tests
+* Update dependencies and `app-volumes` configuration to avoid issues when `app-volumes` is started several times in same `docker-compose up` execution
+* Execute Dockerfile run commands for `app-volumes` in only one layer as it is best practise
+* Update README with `node` and `unison` commands to use `run` instead of `exec`
+* Update `xdebug + phpstorm` documentation
 
 ## [1.0.1] - 15-08-2018
 ### Changed

README.md

@@ -99,7 +99,7 @@ There are 2 options to sync the volumes `vendor` and `generated`
 This option must be used most of the times. You should only need to sync `vendor` and `generated` from time to time for debugging purposes
 
 ```
-docker-compose exec unison sync -path <path_to_sync>
+docker-compose run --rm unison sync -path <path_to_sync>
 ```
 
 **NOTE:** `<path_to_sync>` should be `vendor` or `generated`. For faster and more specific syncs, you can include the subfolder path inside `vendor` like `sync -path vendor/<company_name>`.
@@ -109,33 +109,26 @@ docker-compose exec unison sync -path <path_to_sync>
 This option is only recommended if you are implementing code in a vendor module.
 
 ```
-docker-compose exec unison watch -path <path_to_sync>
+docker-compose run --rm unison watch -path <path_to_sync>
 ```
 
-Example: `docker-compose exec unison watch -path vendor/<company_name>/<module_name>`
+Example: `docker-compose run --rm unison watch -path vendor/<company_name>/<module_name>`
 
 ### Frontend
 
-1. Start node container
+1. NPM config setup (Only first time)
 
 	```
-	docker-compose up node
+	docker-compose run --rm node sh -c "cp -n package.json.sample package.json \
+        && cp -n Gruntfile.js.sample Gruntfile.js \
+        && npm install"
 	```
 
-2. NPM config setup (Only first time)
+2. Grunt watch
 
 	```
-	docker-compose exec node bash
-	cp package.json.sample package.json && cp Gruntfile.js.sample Gruntfile.js
-	npm install
-	```
-
-3. Grunt watch
-
-	```
-	docker-compose exec node bash
-	grunt exec:<theme>
-	grunt watch
+	docker-compose run --rm node sh "grunt exec:<theme>"
+	docker-compose run --rm node sh "grunt watch"
 	```
 
 ## Xdebug

config/docker/image/app-volumes/Dockerfile

@@ -4,10 +4,10 @@ RUN mkdir -p /var/www/html/vendor \
     /var/www/html/generated \
     /var/www/html/var \
     /var/www/html/pub/static \
-    /var/www/html/pub/media
+    /var/www/html/pub/media \
+    /var/www/html/dev/tests/integration/tmp \
+    && chown -R 1000:1000 /var/www/html
 
-RUN chown -R 1000:1000 /var/www/html/vendor \
-    /var/www/html/generated \
-    /var/www/html/var \
-    /var/www/html/pub/static \
-    /var/www/html/pub/media
+# Keep container running until all other containers are created.
+# This avoid issues when this container is started multiple times.
+CMD sleep 30

config/docker/image/node/Dockerfile

@@ -0,0 +1,7 @@
+FROM modestcoders/node-php:node8-php7.1
+
+RUN mkdir -p /home/app \
+    && usermod -d /home/app -l app node \
+    && chown -R app /home/app
+
+USER app

config/docker/image/phpfpm/Dockerfile

@@ -0,0 +1,7 @@
+FROM markoshust/magento-php:7.1-fpm-3
+
+USER root:root
+
+RUN apt-get install -y procps
+
+USER app:app

docker-compose.yml

@@ -12,27 +12,24 @@ services:
       - app-var:/var/www/html/var
       - pub-static:/var/www/html/pub/static
       - pub-media:/var/www/html/pub/media
+      - integration-test-sandbox:/var/www/html/dev/tests/integration/tmp
 
   app:
     build: ./config/docker/image/nginx
     ports:
       - 80:8000
     volumes: *appvolumes
     depends_on:
-      - app-volumes
       - phpfpm
-      - db
-      - unison
 
   phpfpm:
-    image: markoshust/magento-php:7.1-fpm-3
+    build: ./config/docker/image/phpfpm
     volumes: *appvolumes
     environment:
       PHP_IDE_CONFIG: serverName=localhost
     depends_on:
       - app-volumes
       - db
-      - unison
 
   db:
     image: mysql:5.7
@@ -62,12 +59,12 @@ services:
     privileged: true
 
   node:
-      image: modestcoders/node-php:node8-php7.1
-      volumes: *appvolumes
-      environment:
-        - NPM_CONFIG_PREFIX=/home/node/.npm-global # To avoid permission error on npm install. It tries to save it at /var/www (root is the owner)
-      depends_on:
-        - app
+    build: ./config/docker/image/node
+    volumes: *appvolumes
+    environment:
+      - NPM_CONFIG_PREFIX=/home/app/.npm-global # To avoid permission error on npm install. It tries to save it at /var/www (root is the owner)
+    depends_on:
+      - app-volumes
 
 volumes:
   dbdata:
@@ -77,3 +74,4 @@ volumes:
   app-var:
   pub-static:
   pub-media:
+  integration-test-sandbox:

docs/img/debug_port.png

@@ -19,24 +19,40 @@
 	* Select `phpfpm` docker image
 
 	![interpreter_phpfpm_image](img/interpreter_phpfpm_image.png)
-	
-3. `PHPStorm > Preferences > Languages & Frameworks > PHP > DBGp Proxy`
+
+3. `PHPStorm > Preferences > Languages & Frameworks > PHP > Debug`	
+	* Debug Port: 9001
+
+	![debug_port](img/debug_port.png)
+
+4. `PHPStorm > Preferences > Languages & Frameworks > PHP > Debug > DBGp Proxy`
 
 	* Host must match with the `REMOTE_HOST_IP` set on the [Xdebug configuration](xdebug.md)
 
 	![debug_dbgp](img/debug_dbgp.png)
 
-4. `PHPStorm > Preferences > Languages & Frameworks > PHP > Servers`
+5. `PHPStorm > Preferences > Languages & Frameworks > PHP > Servers`
 
 	* Name: `localhost` (Same as `PHP_IDE_CONFIG` in `docker-compose.yml`)
 	* Port: 8000
 	* Mapping: `/Users/<username>/Sites/<project> -> /var/www/html`
 
 	![debug_server_mapping](img/debug_server_mapping.png)
+	
+6. Start Listening for PHP Debug connections
 
+	**NOTE**: Be sure to activate that only after setting the right debug port. Changes in Debug port are ignored once the listener has started.
 
+	![PHPStorm Debug Listener](img/phpstorm_debug_listener.png)
+
 
+7. Install and enable `Xdebug helper` plugin in Chrome
+
+	* [https://chrome.google.com/webstore/detail/xdebug-helper](https://chrome.google.com/webstore/detail/xdebug-helper/eadndfjplgieldjbigjakmdgkmoaaaoc)
 
+	![Xdebug Helper Config](img/xdebug_helper_config.png)
+	![Xdebug Helper Enable](img/xdebug_helper_enable.png)
+