Network Inspection in Stetho with Glide and okhttp3
<p>how to Combine Glide and Stetho to debug image loading system using okhttp3</p>

<p>I did the following</p>

<p>1.Added the dependancies</p>

<pre><code>//stetho
compile 'com.facebook.stetho:stetho:1.3.1'
compile 'com.facebook.stetho:stetho-okhttp3:1.3.1'
//glide
compile 'com.github.bumptech.glide:glide:3.7.0'
// Glide's OkHttp3 Integration
compile 'com.github.bumptech.glide:okhttp3-integration:1.4.0@aar'
//okhttp3
compile 'com.squareup.okhttp3:okhttp:3.2.0'
</code></pre>

<p>1.Added the initialization</p>

<pre><code>public class MyApplication extends Application {

@Override
public void onCreate() {
    super.onCreate();

    Stetho.initialize(
            Stetho.newInitializerBuilder(this)
                    .enableDumpapp(Stetho.defaultDumperPluginsProvider(this))
                    .enableWebKitInspector(Stetho.defaultInspectorModulesProvider(this))
                    .build());
    }
}
</code></pre>

<p>3.add glide config to use okhttp3</p>

<pre><code>/**
 * Created by Arnaud Camus Copied by MOMANI on 2016/04/15.
 * http://arnaud-camus.fr/combining-glide-and-stetho-to-easily-debug-your-image-loading-system/
 */
public class StethoOkHttpGlideModule  implements GlideModule {
    @Override
    public void applyOptions(Context context, GlideBuilder builder) { }

    @Override
    public void registerComponents(Context context, Glide glide) {
        okhttp3.OkHttpClient client = new okhttp3.OkHttpClient();
        client.networkInterceptors().add(new com.facebook.stetho.okhttp3.StethoInterceptor());
        glide.register(GlideUrl.class, InputStream.class, new OkHttpUrlLoader.Factory(client));
    }
}
</code></pre>

<p>4.added the <code>GlideModule</code> metadata tag in <code>AndroidManifest.xml</code></p>

<pre><code>&lt;application 
    android:name="....."&gt;
    .....
     &lt;meta-data android:name="android.alcode.com.material.utils.glide.StethoOkHttpGlideModule"
      android:value="GlideModule" /&gt;
&lt;/application&gt;
</code></pre>

<p>5.Glide loadimg images line </p>

<pre><code>Glide.with(((ViewHolderSmall) holder).imageView.getContext())
                    .load(post.getImageUrl())
            //        .diskCacheStrategy(DiskCacheStrategy.SOURCE)
                    .into(((ViewHolderSmall) holder).imageView);
</code></pre>

<p>when I open chrome Developer tool <code>Resources Tab</code> works perfectly but <code>network tab</code> doesn't!!!</p>

<p>why? where is my mistake? and is it recommended to use <code>okhttp3</code> with Glide? and how how to connect it without using okhttp3</p>

<p>any duplication or links would help</p>