concept

Continuous Integration (CI)

Continuous integration refers to the frequent (multiple times a day) integration of code into the trunk. Benefits: (1) Fast error detection. Every update is integrated into the trunk, making it easy to find and locate errors quickly. (2) To prevent branches from deviating from the trunk. If you do not integrate frequently, the trunk is constantly updated, which can make later integration difficult or even difficult.

Objective:

  • Faster detection of potential software problems, speed up team software development
  • Allowing products to iterate quickly while still maintaining high quality

Process:

  1. Submit code
  2. Test round 1 (Hook triggered unit tests)
  3. build

Jenkins Jenkins is an open source continuous integration tool. It features: Easy to install, easy to configure, extensible (you develop your own plug-ins), and with hundreds of mature plug-ins, this plugin-like nature offers the possibility of doing just about anything.

  1. Test (Second Round)

Full testing, unit testing, integration testing, if possible, end-to-end testing. It is important to note that every update point in a new release must be tested. If the test coverage is not high, serious problems are likely to occur later in the deployment phase.

  1. The deployment of

After the second round of testing, you get a deployable version and archive all the files for that version (tar filename.tar *) to the production server

  1. The rollback

If a problem occurs in the current version, roll back to the build results of the previous version. The easiest way to do this is to modify the symbolic link to point to the directory of the previous version.

Traditional practice:

  • Only after the development is completed can the test environment be installed
  • Manual deployment
  • Manually Modifying configurations
  • Manual regression testing

Low efficiency, quality can not be guaranteed, high safety risk, complex process, low automation, high cost

Integration testing practices:

  • Unified Code Version Management Repository (Git)
  • Automated compilation, packaging, and publishing
  • Automated testing
  • Be transparent with the team

Tools: Git – Version control Docker – Test environment build Jenkins – Continuous integration server

Continuous Delivery (CD)

The frequent delivery of new versions of software to the quality team or users for review, and if the review passes, the code goes into production.

Continuous delivery can be seen as the next step in continuous integration. It emphasizes that software can be delivered anytime, anywhere, no matter how updated it is.

Continuous Deployment

The next step in continuous delivery is when code is reviewed and automatically deployed to production.

The goal of continuous deployment is for the code to be deployable at all times and ready for production. Continuous deployment requires automation of the testing, build, deployment, and other steps.

How to select Gitlab CI/CD and Docker+Jenkins?

Online dial-up CI/CD

Periodically monitor websites, domain names, and background interfaces, check the availability and delay of dial and test tasks, set threshold alarms, notify exceptions in real time, and respond to service quality in a timely manner to ensure stable and normal running of services

White box testing

It is mainly applied in the unit test stage, which is mainly for the code level test. For the internal logic of the program, the test means include: statement coverage, judgment coverage, condition coverage, path coverage, and condition combination coverage.

Black box testing

It is mainly used to test whether the function of the system meets the requirements. Focus on the external structure of the program, regardless of internal logic, for the software interface and software function.

Test type

Unit Testing

Unit testing is at the bottom of the pyramid in the testing layer. If unit testing is done properly, it can filter out most of the problems and find bugs in advance, which can also reduce the cost of bugs.

The main points of
  • White-box testing focuses more on the flow of data
  • Is the foundation of integration testing
  • For infrastructure and generic components (functions or modules)
Technical solution:

Jest supports Matchers way assertions; Support for Snapshot Testing, which tests whether the HTML rendered by component class code is correct; Supports a variety of mocks, including mock method implementations, mock timers, mock dependent modules, and so on. Support Istanbule for easy access to coverage.

Install Jest using yarn:

    yarn add --dev jest

Or npm:

    npm install --save-dev jest

Copy the code

istanbule

The industry’s easy-to-use JS coverage tool uses module-loaded hooks to calculate statement, line, method, and branch coverage to transparently increase coverage when executing test cases. It supports all types of JS coverage, including unit testing, server-side functional testing, and browser testing.

$ npm install -g istanbul

Copy the code

Integration testing

The testing of a function of the overall product, also known as functional testing

E2E Testing (End to End)

The end-to-end test corresponds to the black box test, which only tests the input and output without considering the process state and pays more attention to the presentation of the results. It is a full-link test directly from the user interface to the database

UI Automation testing

Fault 1: High maintenance cost Fault 2: The front end is heavy on user interaction. Simple interface tests and unit tests cannot reflect the operation paths of users

The main points of

Provide unified packages to handle common components, common logic for particular pages, encapsulate common methods, and so on

Technical solution:

Puppeteer is a Node library maintained by Chrome. It runs on Chrome or Chromium based on DevTools and supports headless and non-headless modes. The official website provides very rich documentation, easy to learn. There are many UI automation frameworks, including Selenium, Phantom; After comparison, puppeteer is relatively light, and only one NPM package is required to use it. It is event-driven and is more stable and performs better than Selenium’s wait polling. Plus, it’s Chrome native support, provides all of chrome’s supported apis, and our business scenarios only need to override Chrome, so it’s the best choice. mocha + mochawesome

Mocha is a mainstream testing framework that supports beforeEach, before, afterEach, after hook functions, Assert assertions, test suites, use case choreography, and more. Mochawesome is a third-party plugin for the Mocha testing framework that generates beautiful HTML/CSS reports.

There are also many js test frameworks to choose from, such as Mocha, AVA, Jtest, etc. Mocha is chosen because it is more flexible. Many configurations can be combined with third-party libraries, such as Report, which combines Mochawesome to generate good-looking HTML reports. Assertions can be replaced with powser-assert.

| page dial test online core interface

Performance testing:

  • Performance scoring criteria
  • Figure Volume Optimization (OSS)
  • Performance Optimization Guidelines

* lint detection

Compatibility check

Packet detection, base library change alarm

  • Compare a master code commit or merge request to determine if there is a specific base library version change in package.json
  • Add change log to judge test range

The API testing

Assets check and domain name validity check

Online monitoring

Sentry is an open source bug tracking tool that helps developers monitor and fix crashes in real time.

use

Sentry global information is reported and filtered

  • Error type: TypeError or ReferenceError
  • Influencing factors: Error grades are distinguished by multidimensional degrees
  • The error appears in the JS file
  • Increase the active reporting of abnormal processes of core services

Finally, the filtered error information is sent to the alarm recipient by email, and the alarm is cleared in a fixed time.

other

Gerrit code review

Gerrit code review

Sonar detection

Code Quality & Security for JavaScript It uses the most advanced techniques (pattern matching, dataflow analysis) to find Code Smells, Bugs, and Security Vulnerabilities. Features: Use advanced techniques such as model matching and data flow analysis to find code odors (any symptoms in your code that could lead to deeper problems), bugs, and security vulnerabilities. SonarLint for VS Code SonarSource’s JavaScript analysis supports:

  • ECMAScript 5 / ECMAScript 2015 (ECMAScript 6) / ECMAScript 2016 / ECMAScript 2017
  • React JSX
  • Vue.js
  • Flow

Common code odors: Code duplication: identical or similar code in more than one place. Long method: a very long method, function, or procedure. Macroclass: A very large class. Too many arguments: A long argument list for a function or procedure leads to poor code readability and quality. Attribute attachment: A class’s excessive use of another class’s methods. Intimacy: One class depends on the implementation details of another class. Reject inheritance: A subclass overrides a method in its base class by rejecting it. In other words, a subclass does not want to inherit a method in its parent class. Redundant class/parasite: A class with too few features. Artificial complexity: Forcing extremely complex design patterns when simple designs already meet requirements. Superlong identifiers: In particular, in software engineering, naming conventions should be used without reservation to disambiguate. Hypershort identifiers: Unless it is obvious that a variable name should reflect its function. Overuse of literals: To improve readability and avoid coding errors, use named constants. In addition, literals can and should, where possible, be stored independently in resource files or scripts, making it easy to localize when software is deployed to different locales.

Jenkins+Sonarqueb for automated testing and code quality inspection SonarQube static code quality inspection

pipeline

Pipeline Quick Start

What is Continuous Integration why continuous integration and continuous deployment