[ZEPPELIN-5792][FRONT_BUILD] Remove bower (#4651)

* [ZEPPELIN-5792][FRONT_BUILD] Remove bower Co-Authored-By: holodazoltan <[email protected]> * [ZEPPELIN-5792] Fix broken package-lock.json * ZEPPELIN-5792 Wait before checking welcome page * [ZEPPELIN-5792] Remove npm update * [ZEPPELIN-5792] remove npm update * [ZEPPELIN-5792] Remove bower references --------- Co-authored-by: holodazoltan <[email protected]>
apache · Sep 25, 2023 · ee3b053 · ee3b053
1 parent d67d834
commit ee3b053
Show file tree

Hide file tree

Showing 13 changed files with 5,957 additions and 5,735 deletions.
diff --git a/zeppelin-web/.bowerrc b/zeppelin-web/.bowerrc
diff --git a/zeppelin-web/Gruntfile.js b/zeppelin-web/Gruntfile.js
@@ -27,7 +27,7 @@ module.exports = function(grunt) {
 
   // Configurable paths for the application
   var appConfig = {
-    app: require('./bower.json').appPath || 'src',
+    app: 'src',
     dist: 'dist'
   };
 
@@ -76,10 +76,6 @@ module.exports = function(grunt) {
 
     // Watches files for changes and runs tasks based on the changed files
     watch: {
-      bower: {
-        files: ['bower.json'],
-        tasks: ['wiredep:dist', 'wiredep:test']
-      },
       html: {
         files: [
           '<%= yeoman.app %>/**/*.html'
@@ -105,7 +101,7 @@ module.exports = function(grunt) {
         files: ['Gruntfile.js']
       },
       livereload: {
-        options: {livereload: 35729,},
+        options: {livereload: 35730,},
         files: [
           '<%= yeoman.app %>/app/**/*.html',
           '<%= yeoman.app %>/*.html',
@@ -134,40 +130,6 @@ module.exports = function(grunt) {
       }
     },
 
-    // Automatically inject Bower components into the app
-    wiredep: {
-      ci: {
-        src: ['<%= yeoman.app %>/index.html'],
-        ignorePath: /\.\.\//,
-        exclude: [
-        ]
-      },
-      dist: {
-        src: ['<%= yeoman.app %>/index.html'],
-        ignorePath: /\.\.\//,
-        exclude: [
-        ],
-      },
-      test: {
-        devDependencies: true,
-        src: '<%= karma.unit.configFile %>',
-        ignorePath: /\.\.\//,
-        exclude: [
-        ],
-        fileTypes: {
-          js: {
-            block: /(([\s\t]*)\/{2}\s*?bower:\s*?(\S*))(\n|\r|.)*?(\/{2}\s*endbower)/gi,
-            detect: {
-              js: /'(.*\.js)'/gi
-            },
-            replace: {
-              js: '\'{{filePath}}\','
-            }
-          }
-        }
-      }
-    },
-
     // Reads HTML for usemin blocks to enable smart builds that automatically
     // concat, minify and revision files. Creates configurations in memory so
     // additional tasks can operate on them
@@ -291,7 +253,7 @@ module.exports = function(grunt) {
           src: ['app/**/*.html', 'components/**/*.html']
         }, {
           expand: true,
-          cwd: 'bower_components/datatables/media/images',
+          cwd: 'node_modules/datatables/media/images',
           src: '{,*/}*.{png,jpg,jpeg,gif}',
           dest: '<%= yeoman.dist %>/images'
         }, {
@@ -301,22 +263,22 @@ module.exports = function(grunt) {
           src: ['generated/*']
         }, {
           expand: true,
-          cwd: 'bower_components/bootstrap/dist',
+          cwd: 'node_modules/bootstrap/dist',
           src: 'fonts/*',
           dest: '<%= yeoman.dist %>'
         }, {
           expand: true,
-          cwd: 'bower_components/jquery-ui/themes/base/images',
+          cwd: 'node_modules/jquery-ui/themes/base/images',
           src: '{,*/}*.{png,jpg,jpeg,gif}',
           dest: '<%= yeoman.dist %>/styles/images'
         }, {
           expand: true,
-          cwd: 'bower_components/ngclipboard',
+          cwd: 'node_modules/ngclipboard',
           src: 'dist/**',
           dest: '<%= yeoman.dist %>'
         }, {
           expand: true,
-          cwd: 'bower_components/MathJax',
+          cwd: 'node_modules/MathJax',
           src: [
             'extensions/**', 'jax/**', 'fonts/**'],
           dest: '<%= yeoman.dist %>'
@@ -380,8 +342,6 @@ module.exports = function(grunt) {
 
   grunt.registerTask('pre-webpack-dev', 'Compile then start a connect web server', function(target) {
     grunt.task.run([
-      'wiredep:test',
-      'wiredep:dist',
     ]);
   });
 
@@ -391,14 +351,10 @@ module.exports = function(grunt) {
 
   grunt.registerTask('pre-webpack-dist', [
     'htmlhint',
-    'wiredep:test',
-    'wiredep:dist',
   ]);
 
   grunt.registerTask('pre-webpack-ci', [
     'htmlhint',
-    'wiredep:test',
-    'wiredep:ci',
   ]);
 
   grunt.registerTask('post-webpack-dist', [

diff --git a/zeppelin-web/README.md b/zeppelin-web/README.md
@@ -2,7 +2,7 @@
 
 This is Zeppelin's frontend project.
 
-## Development Guide 
+## Development Guide
 
 ### Local Development
 
@@ -11,50 +11,49 @@ It is recommended to install node 6.0.0+ since Zeppelin uses 6.9.1+ (see [creati
 All build commands are described in [package.json](./package.json)
 
 ```sh
-# install required depepdencies and bower packages (only once)
-$ npm install -g yarn
-$ yarn install
+# install required depepdencies (only once)
+$ npm install
 
 # build zeppelin-web for production
-$ yarn run build
+$ npm run build:dist
 
-# run frontend application only in dev mode (localhost:9000) 
+# run frontend application only in dev mode (localhost:9000)
 # you need to run zeppelin backend instance also
-$ yarn run dev
+$ npm run dev
 ```
 
 Supports the following options with using npm environment variable when running the web development mode.
 
 ```
-# if you are using a custom port instead of default(8080), 
+# if you are using a custom port instead of default(8080),
 # you must use the 'SERVER_PORT' variable to run the web application development mode
-$ SERVER_PORT=YOUR_ZEPPELIN_PORT yarn run dev
+$ SERVER_PORT=YOUR_ZEPPELIN_PORT npm run dev
 
-# if you want to use a web dev port instead of default(9000), 
+# if you want to use a web dev port instead of default(9000),
 # you can use the 'WEB_PORT' variable
-$ WEB_PORT=YOUR_WEB_DEV_PORT yarn run dev
+$ WEB_PORT=YOUR_WEB_DEV_PORT npm run dev
 ```
 
 ### Testing
 
 ```sh
 # running unit tests
-$ yarn run karma-test
+$ npm run karma-test
 
 # running e2e tests: make sure that zeppelin instance started (localhost:8080)
-$ yarn run e2e
+$ npm run e2e
 ```
 
 - to write unit tests, please refer [Angular Test Patterns](https://github.com/daniellmb/angular-test-patterns)
 - to write e2e tests, please refer [Protractor Tutorial](http://www.protractortest.org/#/tutorial#step-1-interacting-with-elements)
 
-### Packaging 
+### Packaging
 
-If you want to package the zeppelin-web only, simply run this command in this folder.  
+If you want to package the zeppelin-web only, simply run this command in this folder.
 This will download all the dependencies including node (the binaries in the folder `zeppelin-web/node`)
 
 ```
-$ mvn package 
+$ mvn package
 ```
 
 ## Troubleshooting
@@ -67,18 +66,12 @@ change your git config with `git config --global url."https://".insteadOf git://
 
 #### Proxy issues
 
-Try to add to the `.bowerrc` file the following content:
-```
-  "proxy" : "http://<host>:<port>",
-  "https-proxy" : "http://<host>:<port>"
-```
-
-also try to add proxy info to yarn install command:
+Try to add proxy info to npm install command:
 ```xml
 <execution>
-	<id>yarn install</id>
+	<id>npm install</id>
 	<goals>
-    	<goal>yarn</goal>
+    	<goal>npm</goal>
     </goals>
     <configuration>
     	<arguments>--proxy=http://<host>:<port> --https-proxy=http://<host>:<port></arguments>

diff --git a/zeppelin-web/bower.json b/zeppelin-web/bower.json
diff --git a/zeppelin-web/e2e/home.spec.js b/zeppelin-web/e2e/home.spec.js
@@ -23,6 +23,7 @@ describe('Home e2e Test', function() {
   //tests
   it('should have a welcome message', function() {
     browser.get('http://localhost:8080');
+    browser.sleep(500);
     var welcomeElem = element(by.id('welcome'))
 
     expect(welcomeElem.getText()).toEqual('Welcome to Zeppelin!')
@@ -47,8 +48,7 @@ describe('Home e2e Test', function() {
     sendKeysToInput(element(by.xpath('//input[@id="newInterpreterSettingName"]')), interpreterName)
     clickOn(element(by.xpath('//select[@ng-model="newInterpreterSetting.group"]')))
     browser.sleep(500)
-    browser.actions().sendKeys(protractor.Key.ARROW_DOWN).perform()
-    browser.actions().sendKeys(protractor.Key.ENTER).perform()
+    browser.actions().sendKeys('angular').perform()
     clickOn(element(by.xpath('//div[@ng-show="showAddNewSetting"]//input[@id="idShowPermission"]')))
     sendKeysToInput(element(by.xpath('//div[@ng-show="showAddNewSetting"]//input[@class="select2-search__field"]')), ownerName)
     browser.sleep(500)